1) Script Title: Drop Down Tabs (5 styles)
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...roptabmenu.htm
3) Describe problem: The submenu links are always visible and are in a row instead of 'dropping down' like they should. My code is below. Please help.
/*HTML*/
Code:<div id="bluemenu" class="bluetabs"> <ul> <li><a href="http://www.dynamicdrive.com">Location</a></li> <li><a href="http://www.dynamicdrive.com/style/" rel="dropmenu1">Site Plan</a></li> <li><a href="http://www.dynamicdrive.com/resources/">Area Attractions</a></li> <li><a href="http://tools.dynamicdrive.com">Real Estate</a></li> <li><a href="http://www.dynamicdrive.com/resources/">Community</a></li> <li><a href="http://tools.dynamicdrive.com">Home</a></li> </ul> </div> <!--1st drop down menu --> <div id="dropmenu1" class="dropmenudiv"> <a href="http://www.cssdrive.com">CSS Drive</a> <a href="http://www.javascriptkit.com">JavaScript Kit</a> <a href="http://www.codingforums.com">Coding Forums</a> <a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a> </div> <script type="text/javascript"> //SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"]) tabdropdown.init("bluemenu", 0) </script> /* CSS Document */ .bluetabs{ display: inline; } .bluetabs ul{ list-style: none; padding: 0em; margin: 0; width: 50em; display: inline; } .bluetabs li{ float: right; margin: 0 0.15em; display: inline; } .bluetabs li a{ height: 2em; line-height: 2em; float: right; width: 8.9em; border: 0.1em solid #dcdce9; display: inline; color: #512600; font-family: arial; font-weight: bold; font-size: 13px; text-decoration: none; text-shadow: #ffffff 2px -2px 2px; text-align: center; margin: 0em; } .bluetabs li a:hover{ color: #9d4b02; } .bluetabs li.selected{ color: #9d4b02; } .bluetabs li.selected a{ /*selected main tab style */ } .bluetabs li.selected a:hover{ /*selected main tab style */ } /* Hide from IE5-Mac \*/ #nav-menu li a { float: none } /* End hide */ /* ######### Style for Drop Down Menu ######### */ .dropmenudiv_b{ position:absolute; top: 0; border: 1px solid #918d8d; /*THEME CHANGE HERE*/ border-width: 0 1px; font:normal 12px Verdana; line-height:18px; z-index:100; background-color: white; width: 200px; visibility: hidden; } .dropmenudiv_b a{ width: auto; display: block; text-indent: 5px; border: 0 solid #918d8d; /*THEME CHANGE HERE*/ border-bottom-width: 1px; padding: 2px 0; text-decoration: none; color: black; } * html .dropmenudiv_b a{ /*IE only hack*/ width: 100%; } .dropmenudiv_b a:hover{ /*THEME CHANGE HERE*/ background-color: #edf3f3; }



Reply With Quote

Bookmarks