virtual Posted April 14, 2011 Report Share Posted April 14, 2011 (edited) Hi Guys, I need some help with a Jquery menu that I am building. http://em asai.com/multi colorJQMenu/dropmenu-lynda.php (remove 2 spaces) using the following plugin http://www.so operthemes.com/open-source/jquery/jquery-sooperfish-dropdown-menus I need the background of the top links (parent) to stay gray #444 all the time the drop down menu is extended. Is there any way I can do this? I'm stuck for the moment. Thanks Edited April 14, 2011 by virtual Quote Link to comment Share on other sites More sharing options...
newseed Posted April 14, 2011 Report Share Posted April 14, 2011 That one looks a bit dated because the script is not supplying a sf-Hover to make the parent link to stay highlighted at a color you desire. Now maybe I don't quite understand what you mean by 'stay gray' since I was unable to view your site example but maybe this superfish will deliver what you are looking for. Quote Link to comment Share on other sites More sharing options...
virtual Posted April 14, 2011 Author Report Share Posted April 14, 2011 Thanks Eddie, I have corrected my link. The script is 2010 so younger than Superfish from which it is inspired. I could not see the sf-Hover in the Superfish link you gave me either. Both of them have this hoverClass : 'sfHover', but I'm not sure if that is what you meant. Quote Link to comment Share on other sites More sharing options...
newseed Posted April 14, 2011 Report Share Posted April 14, 2011 Yes...that's what you need to style to the parent when you have a dropdown open. Quote Link to comment Share on other sites More sharing options...
virtual Posted April 14, 2011 Author Report Share Posted April 14, 2011 Can you elaborate, I don't get it...... Quote Link to comment Share on other sites More sharing options...
falkencreative Posted April 15, 2011 Report Share Posted April 15, 2011 It looks like the Sooperfish menu doesn't add a hover class on the parent <li> by default (which the jquery plugin "Superfish" does) which is pretty much required to style the top level items on hover. Here is what I did to fix it: added these lines just below "$('ul.sf-menu').sooperfish();" (this adds a class to the parent li when subitems are hovered over): $(".sf-parent ul li a").hover( function () { $(this).parents(".sf-parent").addClass("sfHover"); }, function () { $(this).parents(".sf-parent").removeClass("sfHover"); } ); and added one line to your CSS: body ul#nav li.sfHover a { background:#444; } Quote Link to comment Share on other sites More sharing options...
virtual Posted April 15, 2011 Author Report Share Posted April 15, 2011 OK thank you Ben, I will try that tomorrow - too late now. I got the Eddie's Superfish menu link to do what I wanted but it doesn't have easing which is the cool factor with the Sooperfish. Quote Link to comment Share on other sites More sharing options...
virtual Posted April 15, 2011 Author Report Share Posted April 15, 2011 Ben you're a genius! Thank you so much it works like a charm. Quote Link to comment Share on other sites More sharing options...
virtual Posted April 15, 2011 Author Report Share Posted April 15, 2011 Sorry to bother you again, but how do I get the drop down ul li's to stay #666 and #bbb on hover. At the moment they drop down as #666 but when hovered the whole ul changes to #444 with #bbb on hover. Quote Link to comment Share on other sites More sharing options...
falkencreative Posted April 15, 2011 Report Share Posted April 15, 2011 I think adding body ul#nav li.sfHover li a { background:#666; } will fix that -- you'll have to test. Quote Link to comment Share on other sites More sharing options...
virtual Posted April 15, 2011 Author Report Share Posted April 15, 2011 Wow, you are good! I tried something similar but put the li a in front of the sfHover. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.