Question

我的网站上有一个#pagination，默认设置为display:none

当我在整个文档上移动鼠标时，我希望淡入它们并在鼠标移动停止一段时间后将它们淡出。我完全不知道最好的方法是什么。有什么想法？

$(document).ready(function(){

    $(document).on('mousemove', 'body', function() {
        $('#pagination').fadeIn('fast');
        //once the mousemovement stopped I want a 3sec counter till it fades out agian
    });

});

一旦鼠标移动停止，我希望在## pagination＆＃39;之前有一个短暂的延迟。再次淡出。

感谢您的帮助。

Answer 1

假设你想确保用户在淡化我们的#pagination之前停止移动他们的鼠标，你需要设置一个简单的计时器：

$(document).ready(function(){ 

    var c, p = $('#pagination');
    $(document).on('mousemove',function() {        
       p.fadeIn('medium');
       clearTimeout(c);
       c= setTimeout(function(){
           p.fadeOut('medium');
       }, 600);
    });

});

每当用户停止移动鼠标时，#pagination都会淡出。当他们再次开始移动时，#pagination会消失。如果您不希望它重新投入，您可以轻松修改它。

请参阅：http://jsfiddle.net/akVkT/2/

上的实时示例

Answer 2

$(document).ready(function(){

    $(document).on('mouseout', '#pagination', function() {
        $(this).delay(5000).fadeOut('fast');
    });

});

这是5秒。 5秒后它会淡出

jQuery：faveIn在mousemove上导航（） - fadeOut经过一段时间后？

2 个答案: