javascript - 鼠标移动时出现，静止时消失的导航栏

Question

我希望我的导航栏只在鼠标移动时出现，否则不可见。它是固定位置的。我尝试使用

$( "html").mousemove(函数() {

等...

但即使当我将鼠标完全静止不动时，它似乎也会记录鼠标已移动。可能使这有点棘手的是，我希望当鼠标移动到文档中的任何位置时导航栏出现，而不仅仅是在导航栏区域中。只要鼠标不移动，导航栏就应该不可见。

这个想法本质上是只在用户移动鼠标(表示有意改变某些东西)时使导航栏可见，否则它会分散对内容的注意力。

Answer 1

你可以这样做:

HTML

<div>navbar</div>

JavaScript

$("div").hide();

$("html").mousemove(function( event ) {
    $("div").show();

    myStopFunction();
    myFunction();
});

function myFunction() {
    myVar = setTimeout(function(){
        $("div").hide();
    }, 1000);
}
function myStopFunction() {
    if(typeof myVar != 'undefined'){
        clearTimeout(myVar);
    }
}

http://jsfiddle.net/guinatal/GRyEe/2/