[jQuery] Help with jQuery Suckerfish 2-tier navigation
Hello all,
Any help on this is greatly appreciated people :)
I am currently working on a site for a local college -
I have implemented a jquery suckerfish menu as 2 sets of lists,
I am looking to to make the first (top level) nav remain in its hover
state when/while
the second (sub nav) is shown
:S
Other than that its working perfectly
first time posting scripts so here goes....
menu.js //
function mainmenu(){
$(" #nav ul ").css({display: "visible"}); // Opera Fix
$(" #nav li").hover(function(){
$(this).find('ul:first').css({visibility: "visible",display:
"none"}).show(220);
},function(){
$(this).find('ul:first').css({visibility: "hidden"});
});
}
$(document).ready(function(){
mainmenu();
});
-------------------------------------------------------------------------
menu.html //
<div id="navContainer">
<ul id="nav">
<li><a href="default.php" title="Home">Home</a></li>
<li><a href="generalinfo.php" title="General Information">General
Info</a>
<ul>
<li><a href="studentInfo.php" title="Student Information">Student
Info</a></li>
<li><a href="parentInfo.php" title="Parents Portal">Parents Portal</
a></li>
<li><a href="calendar.php" title="College Calendar">Calendar</a></
li>
<li><a href="governors.php" title="Board of Governors">Governors</
a></li>
<li><a href="equalityDiversity.php" title="Equality &
Diversity">Equality & Diversity</a></li>
</ul>
</li>
<li><a href="#" title="Courses">Courses</a>
<ul>
<li><a href="#" title="Full time courses">Full-Time</a></li>
<li><a href="#" title="Part time courses">Part-Time</a></li>
<li><a href="#" title="Adult Education">Adult Ed</a></li>
<li><a href="#" title="Centre of Open and Online
Learining">COOLspots</a></li>
<li><a href="#" title="BusinessPlus">BusinessPlus</a></li>
<li><a href="#" title="International">International</a></li>
</ul>
</li>
<li><a href="news.php" title="News">News</a></li>
<li><a href="publications.php" title="Publications">Publications</
a>
<ul>
<li><a href="#" title="Prospectus">Prospectus</a></li>
<li><a href="#" title="Newsletters">Newsletters</a></li>
</ul>
</li>
<li><a href="contact.php"title="Contact us">Contact us</a></li>
</ul>
</div>