我的导航工作率为90%,但是一旦儿童(子导航)链接被徘徊,我就无法让我的孙子孙女(三级导航)显示出来。
这是我到目前为止的一个小问题: http://jsfiddle.net/CSwgQ/1/
仅供参考:“关于”下的每个子链接目前都有一个用于测试的孙链接。
<script type='text/javascript'>
jQuery(document).ready(function($){
var lastopen = null;
var timeout = null;
jQuery("#access ul li ul").show();
jQuery("#access ul li ul li").hide();
function showmenu(element)
{
element.css("background","url('/var/www/wp-content/themes/GreatWall/images/arrow.png') no-repeat bottom");
// var children = element.find("ul li");
var children = element.children('ul').children('li')
children.show();
}
function hidemenu(element, fade)
{
element.css("background","transparent");
var children = element.find("ul li");
fade = typeof(fade) != 'undefined' ? fade : false;
if(fade)
{
children.fadeOut(300);
}
else
{
children.hide();
}
}
jQuery("#access ul li").each(function(i,v){
jQuery(v).mouseover(function(e){if(timeout != null){clearTimeout(timeout); timeout = null;} if(lastopen != null){hidemenu(lastopen);} lastopen = jQuery(this); showmenu(lastopen);});
jQuery(v).mouseout(function(e){if(timeout != null){clearTimeout(timeout); timeout = null;} timeout=setTimeout(function(){hidemenu(lastopen, true); lastopen = null;},1500);});
});
//jQuery("#access ul li ul").css("display", "block");
//jQuery("#access ul li").each(function(i,v){var width = 0; jQuery(v).find("ul li").each(function(ii,vv){width += jQuery(vv).width();}); var mid = jQuery(v).position().left+jQuery(v).width()/2-width/2; jQuery(v).find("ul li:first").css("margin-left", Math.min(Math.max(0, mid), 940-width));});
//jQuery("#access ul li").each(function(i,v){var width = 0; jQuery(v).find("ul li").each(function(ii,vv){width += jQuery(vv).width();}); var mid = jQuery(v).position().left; jQuery(v).find("ul li:first").css("margin-left", Math.min(Math.max(0, mid), 940-width));});
//jQuery("#access ul li ul").css("display", "none");
});
</script>
任何帮助将不胜感激!提前致谢
答案 0 :(得分:1)
试试这个脚本:http://jsfiddle.net/CSwgQ/3/
这就是你要找的东西:
jQuery(document).ready(function ($) {
$('.menu li').each(function(){
$(this).hover(function(){
$('> ul',this).show();
},function(){
$('> ul',this).delay(1000).fadeOut();
});
});
});