Question

我正在使用One Page Scroll jquery插件（https://github.com/peachananr/onepage-scroll），我想让网站从底部开始。

我有五个部分，所以当我添加：

   $( window ).load(function() { $(".main").moveTo(5); })

页面在顶部加载，然后立即向下滚动到底部。我试图避免这种情况：只是希望它在底部加载，然后用户可以向上导航。

我还在学习jquery / javascript，所以我觉得这是一个简单的修复，这就是为什么我在论坛上找不到答案的原因。

提前感谢您的任何帮助或指导。

Edit: here's the working example

Answer 1

由于两个原因，这将非常困难：

浏览器从上到下构建DOM，就像堆叠块一样倒置。 window.onload或$(document).ready上的处理程序在页面构建和呈现之后才会运行。脚本和内容加载时的任何延迟都会加剧延迟时间。要从一开始就影响它的外观，您的代码甚至需要在window.onload之前运行。（编辑：你可以使用JS在事件处理程序之外，在你正在渲染的元素之前，但它会在这些元素存在之前运行。在其他问题中，你不会知道还有什么高的。）
在呈现DOM之前，没有页面的底部。随着更多块的堆叠，它会获得高度。您可以添加某种绝对高度的包装器，但这有其自身的问题。

如果确实希望这项工作顺利进行，您可能需要更激进的方法。我建议你从初始响应中排除第一页，然后再动态添加它。你可以给它一个内联style="display:none"或者稍后通过AJAX添加它。在顶部注入内容将推送其他所有内容，因此当页面向上扩展时，您需要自动向下滚动。如果你做得对，用户就永远不能说出来。

Answer 2

试试这个：

jQuery( document ).ready(function( $ ) {
    $(".main").moveTo(5);
});

＆＃34;。就绪（）＆＃34;将等待DOM加载，然后在

中执行脚本

Answer 3

我建议你改为使用fullPage.js并使用＆＃39; active＆＃39;用于确定哪个部分在加载时可见的类in its docs：

每个部分都将使用包含section类的div定义。默认情况下，活动部分将是第一部分，作为主页。

...

如果要定义不同的起点而不是第一部分或部分的第一张幻灯片，只需将活动类添加到要首先加载的部分和幻灯片中。

Living demo

<div id="fullpage">
    <div class="section">One</div>
    <div class="section">
        <div class="slide">
            <div class="demo">Demo</div>Two</div>
        <div class="slide">Three</div>
    </div>
    <div class="section active">Third</div>           <!-- Active section -->
    <div class="section">Four</div>
</div>

jquery一页滚动从底部开始

3 个答案: