javascript - 如何在水平溢出的页面上向右滚动？

Question

当用户关闭模态（特别是 Foundation 4 中的 Reveal 模态）时，我想滚动到一个非常宽的页面的最右边缘（故意很宽）。

我尝试在一个完全对齐的 div 上设置一个 id，但这显然不起作用。

Answer 1

要水平滚动，请使用scrollLeft()。

$('body, html').scrollLeft(400);

jQuery 还支持对scrollLeft属性进行动画处理。

要一直向右滚动，您将获得页面的全宽，并减去窗口宽度以获得左边缘：

var left = $(document).outerWidth() - $(window).width();
$('body, html').scrollLeft(left);

Answer 2

您实际上可以使用 div ID 来完成。如果你有这样的 div：

<div id="divid" style="position: absolute; left: 9000px;">Far Right</div>

然后只需更改您location.hash的匹配：

location.hash = "divid";

浏览器将为您处理滚动。

Answer 3

好的，这是一个工作示例：http: //jsfiddle.net/B2aQF/1/

scrollLeft基本上，您可以使用 jQuery 的函数设置 body 的左滚动位置：

$(document).ready(function(){
    $('body').scrollLeft($(document).outerWidth()); 
});

您甚至可以将 scrollLeft 设置为比您需要的更高的数字，因为它不会过度滚动。