Question

我有一个介绍div，用于计算浏览器窗口高度并填充屏幕，然后用户可以向下滚动到下面的主页面内容。

<body>
    <div id="intro"></div>
    <div id="main"></div>
</body>

我正在使用以下JS来计算窗口高度并将其附加到介绍div：

  resizeWindow();
  $(window).resize(resizeWindow);

  function resizeWindow() {
    var ww = $(window).width();
    var bh = $(document).height();
    var wh = $(window).height();
    featureHeight = wh - 0;
    $('#intro').css({'height':featureHeight+'px'});

  }

我正在尝试做的是在页面滚动时减小介绍div的高度，一旦高度达到0并且用户已达到主div内容，我可以删除它以便用户无法再滚动回到它。

非常感谢任何帮助。

Answer 1

var $intro = $('#intro');
$('#container').scroll(function(){
    $intro.height($intro.height() + $intro.offset().top);
    $(document).scrollTop();
    if ($intro.height() <= 0) {
        $intro.remove();
    }
});

你基本上从#intro移除高度，直到它达到零。不过，它有点依赖于页面等于/小于介绍元素本身。

http://jsfiddle.net/xvh4gbb2/1/

减少滚动时div的高度

1 个答案: