大家好.麻烦帮忙看一下.这个JQ的代码怎么能把他收回的时间改成有延迟呢?刚搞了半天没搞出来效果.
---------------------分割线-----------------------
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery.navlevel2 = function(level1,dytime) {
jQuery(level1).mouseenter(function(){
varthis = jQuery(this);
delytime=setTimeout(function(){
varthis.find('ul').slideDown();
},dytime);
});
jQuery(level1).mouseleave(function(){
clearTimeout(delytime);
jQuery(this).find('ul').slideUp();
});
};
jQuery.navlevel2("li.mainlevel",200);
});
</script>---------------------HTML-----------------------------
<div class="dropdown">
<ul id="headerloginnav">
<li class="mainlevel"><span class="showmenua" style="cursor:pointer;">我的账户</span>
<ul><li>aaaaaaaaa</li>
</ul>
</li>
</ul>
</div>
---------------------------CSS-------------------------
#headerloginnav { display:block;float:right;width:199px;}
#headerloginnav .jquery_out {float:left;line-height:32px;display:block; border-right:1px solid #fff; text-align:center; }
#headerloginnav .jquery_out .smile {padding-left:1em;}
#headerloginnav .jquery_inner {margin-left:16px;}
#headerloginnav .jquery { padding:0 2em;}
#headerloginnav .mainlevel { float:right; width:200px;/*IE6 only*/}
#headerloginnav .mainlevel ul {display:none; position:relative; float:left;}
#headerloginnav .mainlevel li { float:left;width:200px;/*IE6 only*/}=======================
现在是鼠标离开就自动收回了,希望能改为有延迟效果的
先谢过了
---------------------分割线-----------------------
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery.navlevel2 = function(level1,dytime) {
jQuery(level1).mouseenter(function(){
varthis = jQuery(this);
delytime=setTimeout(function(){
varthis.find('ul').slideDown();
},dytime);
});
jQuery(level1).mouseleave(function(){
clearTimeout(delytime);
jQuery(this).find('ul').slideUp();
});
};
jQuery.navlevel2("li.mainlevel",200);
});
</script>---------------------HTML-----------------------------
<div class="dropdown">
<ul id="headerloginnav">
<li class="mainlevel"><span class="showmenua" style="cursor:pointer;">我的账户</span>
<ul><li>aaaaaaaaa</li>
</ul>
</li>
</ul>
</div>
---------------------------CSS-------------------------
#headerloginnav { display:block;float:right;width:199px;}
#headerloginnav .jquery_out {float:left;line-height:32px;display:block; border-right:1px solid #fff; text-align:center; }
#headerloginnav .jquery_out .smile {padding-left:1em;}
#headerloginnav .jquery_inner {margin-left:16px;}
#headerloginnav .jquery { padding:0 2em;}
#headerloginnav .mainlevel { float:right; width:200px;/*IE6 only*/}
#headerloginnav .mainlevel ul {display:none; position:relative; float:left;}
#headerloginnav .mainlevel li { float:left;width:200px;/*IE6 only*/}=======================
现在是鼠标离开就自动收回了,希望能改为有延迟效果的
先谢过了
jQuery.navlevel2 = function(level1,dytime) { jQuery(level1).mouseenter(function(){
varthis = jQuery(this);
delytime=setTimeout(function(){
varthis.find('ul').slideDown();
},dytime); });
jQuery(level1).mouseleave(function(){
clearTimeout(delytime);
///////这样??
delytime=setTimeout(function(){
varthis.find('ul').slideUp();},dytime);
});
};
jQuery.navlevel2("li.mainlevel",200);
});
<li>aaaaaaaaa</li><li>aaaaaaaaa</li><li>aaaaaaaaa</li>
</ul> jQuery(level1).mouseleave(function(){
clearTimeout(delytime);
jQuery(this).find('ul').slideUp(1000);//动画时间设置为1s,默认500ms
});
};