javascript - 导航栏定期出现和消失

Question

我有一个代码，旨在使导航栏在鼠标静止时消失，当鼠标移动时，它应该淡入。该代码有效，除了当鼠标静止时，导航栏会淡出淡出，但几秒钟后就会淡出，并继续定期淡出和淡入。出现问题的网站是here 。 我的代码如下

$("#header").hide();

$("html").mousemove(function( event ) {
$("#header").fadeIn(1500);

myStopFunction();
myFunction();
});

function myFunction() {
myVar = setTimeout(function(){
    $("#header").fadeOut(1500);
}, 2000);
}
function myStopFunction() {
if(typeof myVar != 'undefined'){
    clearTimeout(myVar);
}
}

Answer 1

试试这个(模式)

$(function () {
    var _toggle = function () {
        $(document).one("mousemove.t", function (e) {
            e.target = $("#header");
            $(e.target).toggle(1500).delay(2000).toggle(1500, function () {
                _toggle()
            })
        })
    };
    $.when(_toggle())
})

jsfiddle http://jsfiddle.net/guest271314/8VeDN/