[jQuery] Need help for a small little Menue System
Hello Guys,
first of all i want to say a "Hello" to all of you!
I'm new to jQuery and do my first steps. I have the following Menu in my
HTML:
------ code start ------
<div id="submenu">
<ul>
<li> test.de Hauptmenü 1 </li>
<li class="parent item18"> http://www.mainteam.de/ Hauptmenü 2
<ul>
<li> showmore Mehr Infos </li>
</ul>
</li>
<li class="parent item19"> test.de Hauptmenü 3
<ul>
<li> test.fr Weitere Infos </li>
</ul>
</li>
</ul>
</div>
------ code end ------
When the HTML Page is loaded, i want to collapse all Submenus available and
on mouseover of the Main Menu Part, the Submenus has to be expanded - on
mouseout collapse.
I have done this by the following code - it works!!
------ code start ------
jQuery(document).ready(function(){
jQuery('#submenu ul li').each(function(){
var hasclass = jQuery(this).attr('class');
if ( hasclass.indexOf('parent') != '-1' )
{
jQuery('#submenu ul li ul').css('display','none');
}
});
jQuery('#submenu ul li a').mouseover(function(){
var hasul = $(this).parent().attr('class');
if( hasul.indexOf('parent') != '-1' )
{
var reparent = hasul.replace('parent ','');
if( reparent != '' )
{
var ulstate = $('#submenu ul li.'+reparent+' ul').css('display');
if( ulstate == 'none' )
{
$('#submenu ul li.'+reparent+' ul').slideDown(500);
} else
{
$('#submenu ul li.'+reparent+' ul').slideUp(500);
}
}
}
});
jQuery('#submenu ul li a').mouseout(function(){
var hasul = $(this).parent().attr('class');
if( hasul.indexOf('parent') != '-1' )
{
var reparent = hasul.replace('parent ','');
if( reparent != '' )
{
var ulstate = $('#submenu ul li.'+reparent+' ul').css('display');
if( ulstate == 'none' )
{
$('#submenu ul li.'+reparent+' ul').slideDown(500);
} else
{
$('#submenu ul li.'+reparent+' ul').slideUp(500);
}
}
}
});
});
------ code end ------
Now my Question
I thinks there's a much better way to do this or???
Where's my Mistake and how can i improve??
Thanks for all,
Sascha
--
View this message in context: http://www.nabble.com/Need-help-for-a-small-little-Menue-System-tp26073904s27240p26073904.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.