Hi,
I am populating a menu control from database in my page load event. In my page load event I am using a JavaScript to hide the menu. And in one image link mouse hover I am calling one more JavaScript function to make it visible.
My problem is my menu is not hiding automatically in mouse out.
My Menu:
<asp:Menu ID="mnuProject" runat="server"
onmenuitemclick="mnuProject_MenuItemClick" Style="z-index: 200; left: 1200px;
position: absolute; top: 97px"
DynamicHorizontalOffset="2"
MaximumDynamicDisplayLevels="6";
StaticSubMenuIndent="10px"
Height="0px"
StaticMenuItemStyle-CssClass="menuItemA"
DynamicMenuItemStyle-CssClass="subMenuItemA"
DynamicHoverStyle-CssClass="subMenuItem_selectedA">
CSS:
.menuItemA
{
font-family: Arial;
font-size: small;
color: White;
background-attachment: scroll;
background-image:url('../Images/small-bar.png');
}
.subMenuItemA
{
font-family: Arial;
font-size: small;
color: Navy;
background-attachment: scroll;
background-image: url("../Images/Menu subitem background silver.png");
padding-top: 5px;
padding-bottom:5px;
}
.subMenuItem_selectedA
{
font-family: Arial;
font-size: small;
color: Blue;
padding-top: 5px;
}
Load event code:
mnuProject.Items.Clear();
DataSet ds = master.SelectProjectDetails();
Menu menu = new Menu();
foreach (DataRow parentItem in ds.Tables[0].Rows)
{
MenuItem categoryItem = new MenuItem((string)parentItem["ProjectName"]);
mnuProject.Items.Add(categoryItem);
}
mnuProject.Attributes.Add("style", "visibility:hidden;z-index: 200; left: 1200px; position: absolute; top: 97px");
To make it visible:
In some image mousehover :
function showProject() {
document.getElementById('mnuProject').style.visibility = 'visible';
}
Please solve my problem guys.