如何延迟我的浮动ShareBar Till用户向下滚动页面

时间:2012-11-15 19:16:17

标签: javascript jquery floating searchbar

我已经完成了一些教程,但仍然无法解决我的问题,因此我发布了这个。

我想知道您是否可以告诉我如何让我的浮动共享栏@ http://www.patchworkoftips.com/blackberry-messenger-voip-voice-calls/1983/仅在用户向下滚动100px页面或在文章中途获得时显示。

这是我的共享栏css:

#search_bar {
    z-index: 1000;
    position: fixed !important;
    top: 0;
    width: 1082px;
    color: #FFF;
    background: #333;
    padding-top: 1px;
    padding-bottom: 1px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

抱歉,我无法粘贴共享栏代码,因为它一直在消失。

我是使用javascript和jquery的新手,因此非常感谢复制和粘贴解决方案。

1 个答案:

答案 0 :(得分:1)

$(window).on('scroll', function(){
    if($(window).scrollTop() > 100){ // The '100' can be set to what ever pixel height you want
         $('#search_bar').fadeIn('500'); // This shows the share bar
    }else{
         $('#search_bar').fadeOut('500'); // This hides the share bar
    }
});