滚动显示/隐藏 div答案

【问题标题】：Show/Hide Div on Scroll滚动显示/隐藏 div
【发布时间】：2012-10-26 08:44:25
【问题描述】：

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

【问题讨论】：

【解决方案1】：

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


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

Sample

【讨论】：

@freebird 哇。这很简单，就像一个魅力！谢谢！

【解决方案2】：

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

【讨论】：

【解决方案3】：

试试这个代码

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

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

【讨论】：

【解决方案4】：

当您想要对其进行动画处理并在几秒钟后开始淡出时，这是我的答案。我使用不透明度是因为首先我不想完全淡出它，其次，它不会在多次滚动后返回和强制。

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

【讨论】：

我用它在 4 秒后隐藏按钮并在用户再次滚动时显示它

【解决方案5】：

$.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);

这应该可以解决问题！

【讨论】：

【解决方案6】：

我有一个很好的答案试试这个代码；）

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

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

【讨论】：