我确实有一个 jquery 的问题。我有一个带有“show_your_stuff”的分区 block 。当我将鼠标悬停在另一个 div block 上时,就会出现我想要的。当我再次将鼠标移到上方时,divblock 消失了。我希望 divblock 在 60 秒后消失,而无需再次进行新的鼠标操作。有人可以帮助我吗?
这是我的代码:
<script type="text/javascript">
$(document).ready(function() {
$("a#controlbtn").hover(function(e) {
e.preventDefault();
var slidepx=$("div#linkblock").width() + 10;
if ( !$("div#maincontent").is(':animated') ) {
if (parseInt($("div#maincontent").css('marginRight'), 10) < slidepx) {
$(this).addClass('close').html('Show your stuffs');
margin = "+=" + slidepx;
} else {
$(this).removeClass('close').html('Hide your stuffs');
margin = "-=" + slidepx;
}
$("div#maincontent").animate({
marginRight: margin
}, {
duration: 'slow',
easing: 'easeOutQuint'
});
}
});
});
</script>
最佳答案
可以分别使用setTimeout
和clearTimeout
来延迟和取消鼠标离开和重新进入时的隐藏效果:
$(element).mouseover(function() {
if (typeof delayTime != 'undefined')
window.clearTimeout(delayTime);
$('#tooltip').animate({/*CSS to show element*/},{duration: XXX, queue: false});
});
$(element).mouseout(function() {
delayTime = window.setTimeout(function(){
$('#tooltip').animate({/*CSS to hide element*/},{duration: XXX, queue: false});
}, XXX);
});
...其中每个 XXX
都是代表延迟或持续时间(以毫秒为单位)的数字。
关于JQuery 随时间悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8734866/