1

我有这个'magicbar'导航,我希望保持隐藏,直到用户滚动过去的介绍 div(那个 div 离开屏幕的地方)。我从这里的这个 SO 问题中获取了我的 JQuery, 并将 '>=' 替换为 '==',就像这里的 SO 问题一样。

我实际上只是尝试告诉浏览器设置一个我已经到达 div 末尾的警报,但这也不起作用。我还尝试将隐藏的 div 移动到页面中间,以防事件触发并且它在屏幕外“显示”。页面上加载了 jQuery,它成功隐藏了 div,因此脚本的第一部分正在运行。没有功能的是肉和土豆。作为一个 jQuery 菜鸟,我不明白为什么这不起作用。

这是我的代码:

<script>
$("#magicnav").hide();
jQuery(function ($) {
    $('#intro').bind('scroll', function () {
       if ($(this).scrollTop() + $(this).innerHeight() == $(this).scrollHeight){
           $("#magicnav").show();
       }
    });
});   
</script>

**更新这是问题的一个jsfiddle

4

2 回答 2

1

正确的获取方式scrollHeight是这样的:

$(this)[0].scrollHeight

或者

$(this).prop('scrollHeight')
于 2013-11-08T10:17:50.677 回答
1

我想到了。问题与我的 div 不够大而无法“滚动”这一事实有关,我不得不以不同的方式解决这个问题。感谢This SO question here的帮助,我完全放弃了早期的代码,而不是专注于“div的底部”,而是专注于到达页面上的某个点。

$('#magicnav').hide();
   var target = $(".yellowbg").offset().top;
   var interval = setInterval(function() {
   if ($(window).scrollTop() >= target) {
      $('#magicnav').show();
      clearInterval(interval);
     }
  }, 250);

其中'yellowbg'是我之前定位的div之后页面下一部分的类。

于 2013-11-08T21:15:22.630 回答