Question

我有一个网页，其中包含部分内容。每个部分的宽度和高度均为100％。我的Section1位于网页的顶部。第1节下面的第2节，依此类推。例如我的视图在Section2上，我想隐藏Section1。隐藏Section1后，Section2位于顶部。但浏览器记得，它低于Section1并将一个部分向下滚动到Section3。那么我应该如何避免这种滚动？

    <section id="1">

    </section>
    <section id="2">

    </section>
    <section id="3">

    </section>

    <script type="text/javascript">
        <!--the view is on section2-->
        $('#1').addClass('hidden');
    </script>

Answer 1

让我们先澄清一下：

浏览器记住，它低于Section1并滚动一个第3节。

浏览器无法记住并且不会滚动任何内容。浏览器滚动x像素，删除第一部分后仍然滚动x像素，但第2部分占用的空间现在被第3部分占用。

您需要做的是将垂直滚动固定到删除div #1后的位置。当它们占据100％的高度时，它会滚动负值window.height：

$(window).scrollTop( $(window).scrollTop() - $(window).height() );

或者，如果您想将其滚动到#2部分的开头，那么您必须这样做：

$(window).scrollTop( $("#2").offset().top );

你可以看到它在这个jsfiddle上工作：http://jsfiddle.net/7wegxuyu/4/（它包含两个例子，一个被注释，你需要取消注释才能看到它正常工作）

隐藏元素后更新滚动条

1 个答案: