SitePoint Sponsor |
|
User Tag List
Results 1 to 3 of 3
-
Jun 5, 2007, 06:19 #1
- Join Date
- Mar 2005
- Posts
- 113
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Force parent to stay hovered while hover submenu?
The javascript isn't my great fore. So how should the script be written to force the parent li to stay hovered (highlighted) while hover the submenu? Here's example of drop down: http://deafiron.com/mdd/test2.html
nav buildup:
Code:<div class="navs"> <ul id="nav" class="clear"> <li><a href="#">Sideline</a> <ul></ul> </li> <li><a href="#">League</a> <ul> <li><a href="#">submenu</a></li> <li><a href="#">submenu</a></li> <li><a href="#">submenu</a></li> </ul> </li> <li><a href="#">Scoreboard</a> <ul> <li><a href="#">submenu</a></li> <li><a href="#">submenu</a></li> </ul> </li> <li><a href="#">Resources</a> <ul> <li><a href="#">submenu</a></li> </ul> </li> <li><a href="#">Contact</a> <ul></ul> </li> </ul> </div>
Thanks,
jace
-
Jun 5, 2007, 06:34 #2
- Join Date
- Mar 2005
- Location
- USA
- Posts
- 5,482
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You don't need JavaScript for that. You just need to tweak a few CSS rules. (Changes are in bold. At this point you don't need the new rule, however, I expect you'll add a hover style to those links eventually.)
Code:ul#nav li a:hover, ul#nav li:hover a { background-color: #292929; } ul#nav li:hover li a { background-color: transparent; }
We miss you, Dan Schulz.
Learn CSS. | X/HTML Validator | CSS validator
Dynamic Site Solutions
Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.
-
Jun 5, 2007, 08:36 #3
- Join Date
- Mar 2005
- Posts
- 113
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Great it did the trick. I did seen this classes in suckerfish sample but didn't realized I need them to do this trick. Thanks for point it out!
Jace
Bookmarks