Question

在导航div正确自动隐藏时遇到问题。

我想要发生的是：

默认情况下，我的导航已隐藏。

当用户点击链接或用户鼠标停留在浏览器窗口底部附近时，将显示导航（向上滑动）。我的导航位于id为“tS2”的div中。当用户将鼠标移离导航div时，导航将在短暂延迟后隐藏（向下滑动）。

我正确使用鼠标位置脚本

$(document).mousemove(function(ev){
 var ev = ev || window.event;
 //console.log('Mouse y ='+ev.pageY);
 if(ev.pageY>(_windowHeight-120)){
    console.log('YES triggered show nav!');
    showNav(true,1000)
 }

}）;

这是我的shownav函数，可以在文档加载时正常工作。但是当我调用showNav（true，1000）时，导航会立即跳转到视图中而不是逐渐超过1秒（我的持续时间）。有人能发现我的错误吗？

function showNav(bflag,dur,delay){
if(bflag===true){
    $("#tS2").stop(true,true).animate({
                'bottom':'0'
            }, dur);
}else{
    $("#tS2").stop(true,true).animate({
                'bottom':'-125px'
            }, dur);
}
}

showNav(false,1000);

Answer 1

根据你的描述，我把这个小提琴放在一起

http://jsfiddle.net/zPs4G/3/

尝试一下：）

Answer 2

您没有提供很多详细信息，但听起来您希望导航执行以下操作：

$('#tS2').slideToggle('slow', function() {
    // Animation complete.
});

把它放在你的console.log的位置，我想你差不多完成了。你只需要一个相应的if语句来触发鼠标输出事件，但你已经知道如何做到这一点。

自动隐藏浏览器窗口底部的导航

2 个答案: