Question

我在网页上显示一些图片，我希望它一旦页面加载就一直滚动到底部，然后淡入图像。这就是我的代码到目前为止的样子：

    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script>
        $(document).ready(function(){
            // fade in initial image
            $("#lower").fadeIn(3000);
            $("#lower").css("display", "block;");

            // show only initial image at mid-page
            var margin = ( $(window).height() - $("#lower").height() ) * (0.5);
            $("#lower").css("margin-top", margin);

            // set scroll position to bottom of page
            $(document).scrollTop( $(document).height() );

        });
    </script>

我的html看起来像这样：

<body>
    <div id="view">
        <img id="upper" src="pages/2.gif">
        <img id="lower" src="pages/1.gif">
    </div>
</body>

（＃upper有不透明度0，我打算稍后在用户向上滚动到图像时淡出它）

我遇到的问题是页面在加载时不会一直滚动到底部。我尝试了很多东西，包括将.scrollTop函数的选择器更改为body和/或html标签以及文档或窗口。我甚至试图过度地超出scrollTop值，但无济于事。

任何人都可以告诉我为什么页面在加载时不会一直滚动到底部？

[编辑] 抱歉抱歉，代码邋。总决赛周和小睡觉。对于同样的问题，这是同一件事的非拼写版本。我甚至在这里超过了scrollTop参数，但结果是一样的。

观察：刷新后滚动位置仍然存在。这可能与顽固的滚动位置有关吗？

Answer 1

你这里有一个错字：

var margin = ($(window).hieght() - $("#lower").height())/2;
//----------------------^^^^^^^---a spelling typo

应该是：

var margin = ($(window).height() - $("#lower").height())/2;

因此，脚本执行停止，它永远不会进入您完成scrollTop的行。总而言之，它会因错误而停止，并且不会进一步执行。

此外，我想补充一点，这不是一种正确的做法：

$("#lower").attr("style", "display: block;")

您可以使用.css()方法：

$("#lower").css("display", "block");

或简单.show(), fadeIn(), .toggle('show') etc.。

jQuery - scrollTop命令不滚动

1 个答案: