滚动显示/隐藏Div

时间:2012-11-06 11:44:25

标签: jquery scroll show-hide

我有一个div位于幻灯片的底部,当用户滚动或使用向下箭头时我想要消失,然后在滚动回到顶部时重新出现。我猜这是结合了jquery滚动功能?

6 个答案:

答案 0 :(得分:53)

<div>
    <div class="a">
        A
    </div>

</div>​


$(window).scroll(function() {

    if ($(this).scrollTop()>0)
     {
        $('.a').fadeOut();
     }
    else
     {
      $('.a').fadeIn();
     }
 });

<强> Sample

答案 1 :(得分:2)

$(window).scroll(function () {
  var Bottom = $(window).height() + $(window).scrollTop() >= $(document).height();
if(Bottom )
{
$('#div').hide();
}
});

答案 2 :(得分:1)

试试此代码

$('window').scrollDown(function(){$(#div).hide()});

$('window').scrollUp(function(){ $(#div).show() });

答案 3 :(得分:1)

这是我的答案,当你想要动画它并在几秒后开始淡出它。我使用了不透明度,因为首先我并不想完全淡化它,其次,它不会在许多卷轴之后返回并强制使用。

$(window).scroll(function () {
    var elem = $('div');
    setTimeout(function() {
        elem.css({"opacity":"0.2","transition":"2s"});
    },4000);            
    elem.css({"opacity":"1","transition":"1s"});    
});

答案 4 :(得分:0)

我有一个很好的答案尝试此代码;)

<div id="DivID">
</div>

$("#DivID").scrollview({ direction: 'y' });
$("#DivID > .ui-scrollbar").addClass("ui-scrollbar-visible");

答案 5 :(得分:0)

$.fn.scrollEnd = function(callback, timeout) {          
  $(this).scroll(function(){
    var $this = $(this);
    if ($this.data('scrollTimeout')) {
      clearTimeout($this.data('scrollTimeout'));
    }
    $this.data('scrollTimeout', setTimeout(callback,timeout));
  });
};

$(window).scroll(function(){
    $('.main').fadeOut();
});

$(window).scrollEnd(function(){
    $('.main').fadeIn();
}, 700);

那应该做伎俩!