如何使用.show（）从顶部而不是从左边取出隐藏div？

我试图让我的导航菜单从顶部弹起，当它到达某个锚点时。我目前使用.show（）/。hide（）来实现这一点，但它只是从左侧缓解。我试图将.animate（）并入，但没有运气。如何使用.show（）从顶部而不是从左边取出隐藏div？

这是我到目前为止有：

var t = $("#about").offset().top; 
 

 
$(window).scroll(function(){ 
 
    if($(document).scrollTop() >= t) { 
 
     $('#global-nav').show(500, 'easeOutBounce'); 
 
    } else { 
 
     $('#global-nav').hide(500, 'easeInExpo'); 
 
    } \t \t 
 
});

html { 
 
    height: 2000px; 
 
} 
 
#global-nav { 
 
    height:50px; 
 
    background:#000; 
 
    z-index: 9999; 
 
    position: fixed; 
 
    left: 0; 
 
    top: 0; 
 
    width: 100%; 
 
    display: none; 
 
} 
 
#about{ 
 
    margin-top:400px; 
 
}

<div id="global-nav"></div> 
 

 
<div id="about"></div>

我使用jQuery的缓解插件，并有当前的代码在这里的功能，只需向下滚动即可看到它在行动：http://jsfiddle.net/Hysteresis/0oazqj4y/30/

是否有.show（）指定方向易用性的选项还是我需要合并.animate（）一些方法？我对jQuery相当陌生，并且一直在努力完成这一切都无济于事。任何帮助，将不胜感激。

来源

2014-11-06 Hysteresis

使用.SlideDown尝试（）jQuery中http://api.jquery.com/slidedown/

来源

2014-11-06 19:43:47

这样的：http://jsfiddle.net/0oazqj4y/34/ – 2014-11-06 19:44:02

哇，我觉得自己像个白痴。这是完美的，谢谢！我试图将其添加到我的网站，但由于某些原因，缓动动画无法正常工作。你知道任何可能干扰它的东西吗？如果不是，不用担心。再次感谢！ – Hysteresis 2014-11-06 20:27:23

功能尝试使用滑动（）或它的变体。下面是用滑下来展示一个例子，向上滑动隐藏：

$(window).scroll(function(){ 
    if($(document).scrollTop() >= t) { 
     $('#global-nav').slideDown(500, 'easeOutBounce'); 
    } else { 
     $('#global-nav').slideUp(500, 'easeInExpo'); 
    }  
});

来源

2014-11-06 20:01:29 K2so

如何使用.show（）从顶部而不是从左边取出隐藏div？

回答

相关问题