I have a panel that has a HoverMenuExtender added so as to produce a sort of dropdown menu and my problem is that for a second when the page is loading you can get a glimpse of the links in the menu.Any tips out there on overcoming this flashing of the menu items when the page is loading?\[code\]<!--Hover-menu-1 --><div id ="hoverMenu1"> <div id="Trigger1" class="Trigger" runat="server" > <asp:Hyperlink id="btnproduct" runat="server" NavigateUrl="~/Default.aspx" title="Home" onfocus="this.blur();">Home...</asp:Hyperlink> <asp:Image ID="Image1" runat="server" ImageUrl="~/ExpandingPanel/expand2.jpg" ToolTip="Menu..." style="position: relative; top: 2px; left: 0px" /></div> <asp
anel ID="Panelpopup" runat="server" CssClass="invis_panel"> <!-- css invis_panel by default - to stop it flashing/showing on page load --> <div id="Menu_items"> <asp:Hyperlink id="to_Speach" class="Format4_menu_items" runat="server" NavigateUrl="~/Speach.aspx" title="Speach" onfocus="this.blur();">Speach</asp:Hyperlink> <asp:Hyperlink id="to_AutoGallery" class="Format4_menu_items" runat="server" NavigateUrl="Auto_Gallery.aspx" title="Auto Gallery" onfocus="this.blur();">Gallery</asp:Hyperlink> <asp:Hyperlink id="to_FileListings" class="Format4_menu_items" runat="server" NavigateUrl="File_listings.aspx" title="Search" onfocus="this.blur();">Search</asp:Hyperlink> <asp:Hyperlink id="to_ContactUs" class="Format4_menu_items" runat="server" NavigateUrl="Contact_Us.aspx" title="Contact Us" onfocus="this.blur();">Contact Us</asp:Hyperlink> <asp:Hyperlink id="to_Links" class="Format4_menu_items" runat="server" NavigateUrl="Links_Resources.aspx" title="Links & Resources" onfocus="this.blur();">Links & Resources</asp:Hyperlink> </div> <div><asp:Image ID="Bottom_of_Menu" runat="server" ImageUrl="~/new_dropdowns/bottom.png" /></div> </aspanel> <cc1:HoverMenuExtender ID="HoverMenuExtender1" runat="server" TargetControlID="Trigger1"PopupControlID="Panelpopup"PopupPosition="Bottom" OffsetX="11" PopDelay="35"> </cc1:HoverMenuExtender> </div> <!-- end of Hover-menu-1 -->\[/code\]================================= css ========================\[code\] #hoverMenu1 { z-index: 10; left: 693px; top: 11px; position: absolute; height: 100px; width: 175px; } #hoverMenu1 a { font-weight:lighter; text-decoration: none; } .Trigger { background-image: url('./new_dropdowns/top_3.png'); background-repeat:no-repeat; padding: 7px 0 7px 0; width: 145px; text-align: center; } #Menu_items{ background-image: url('./new_dropdowns/filler.png'); background-repeat: repeat-y; } #Menu_items a { font-weight:lighter; text-decoration: none; } #Menu_items a:hover { background: url(./new_dropdowns/hover_filler.png) 0 -32px; } .invis_panel{ height: 0px; overflow: hidden; } .show_panel{ height: 150px; overflow: visible; } .Format4_menu_items { display: block; padding: 0 10px 4px 10px; }\[/code\]So again, how would/should I go about showing the menu with it hidden (invis_panel) by default?I know something like \[code\]Panelpopup.CssClass = "show_panel"\[/code\] can be used from the codebehind, but I would like to trigger this after the page has loaded (so the flash doen't happen) - javascript or a timer might help there - but I would like to know of other methods and am trying to keep things simple.Looking for an on hovering over the trigger - bit of css/js maybe - to show the panel or switch the cssclass.
anel ID="Panelpopup" runat="server" CssClass="invis_panel"> <!-- css invis_panel by default - to stop it flashing/showing on page load --> <div id="Menu_items"> <asp:Hyperlink id="to_Speach" class="Format4_menu_items" runat="server" NavigateUrl="~/Speach.aspx" title="Speach" onfocus="this.blur();">Speach</asp:Hyperlink> <asp:Hyperlink id="to_AutoGallery" class="Format4_menu_items" runat="server" NavigateUrl="Auto_Gallery.aspx" title="Auto Gallery" onfocus="this.blur();">Gallery</asp:Hyperlink> <asp:Hyperlink id="to_FileListings" class="Format4_menu_items" runat="server" NavigateUrl="File_listings.aspx" title="Search" onfocus="this.blur();">Search</asp:Hyperlink> <asp:Hyperlink id="to_ContactUs" class="Format4_menu_items" runat="server" NavigateUrl="Contact_Us.aspx" title="Contact Us" onfocus="this.blur();">Contact Us</asp:Hyperlink> <asp:Hyperlink id="to_Links" class="Format4_menu_items" runat="server" NavigateUrl="Links_Resources.aspx" title="Links & Resources" onfocus="this.blur();">Links & Resources</asp:Hyperlink> </div> <div><asp:Image ID="Bottom_of_Menu" runat="server" ImageUrl="~/new_dropdowns/bottom.png" /></div> </aspanel> <cc1:HoverMenuExtender ID="HoverMenuExtender1" runat="server" TargetControlID="Trigger1"PopupControlID="Panelpopup"PopupPosition="Bottom" OffsetX="11" PopDelay="35"> </cc1:HoverMenuExtender> </div> <!-- end of Hover-menu-1 -->\[/code\]================================= css ========================\[code\] #hoverMenu1 { z-index: 10; left: 693px; top: 11px; position: absolute; height: 100px; width: 175px; } #hoverMenu1 a { font-weight:lighter; text-decoration: none; } .Trigger { background-image: url('./new_dropdowns/top_3.png'); background-repeat:no-repeat; padding: 7px 0 7px 0; width: 145px; text-align: center; } #Menu_items{ background-image: url('./new_dropdowns/filler.png'); background-repeat: repeat-y; } #Menu_items a { font-weight:lighter; text-decoration: none; } #Menu_items a:hover { background: url(./new_dropdowns/hover_filler.png) 0 -32px; } .invis_panel{ height: 0px; overflow: hidden; } .show_panel{ height: 150px; overflow: visible; } .Format4_menu_items { display: block; padding: 0 10px 4px 10px; }\[/code\]So again, how would/should I go about showing the menu with it hidden (invis_panel) by default?I know something like \[code\]Panelpopup.CssClass = "show_panel"\[/code\] can be used from the codebehind, but I would like to trigger this after the page has loaded (so the flash doen't happen) - javascript or a timer might help there - but I would like to know of other methods and am trying to keep things simple.Looking for an on hovering over the trigger - bit of css/js maybe - to show the panel or switch the cssclass.