24

如果单击按钮，是否有一种简单的方法可以强制浏览器滚动到顶部？

我试过了

jQuery('html').scrollTop();
jQuery('body').scrollTop();
jQuery(window).scrollTop();

他们似乎都没有滚动到页面顶部。

4

5 回答 5

56

由于跨浏览器的奇怪，有些浏览器会响应，有些会'html'响应'body'. 也许这只是我的运气，但.scrollTop(0)从来没有让我移动页面。试一试：

jQuery('html,body').animate({scrollTop:0},0);

此版本针对所有桌面浏览器和移动设备进行了测试和跨浏览器。

于 2012-05-24T21:30:55.813 回答
32

简单的纯 javascript，也适用于移动设备

window.scrollTo(0,0);
于 2012-05-24T21:32:27.807 回答
6

你可以使用这个：

jQuery('body').scrollTop(0);

或这个：

jQuery(window).scrollTop(0);

或者最后这个：

jQuery('html').scrollTop(0);

因此，为了调用该scrollTop方法并使您的页面滚动，您应该传递一个带有表示 scrollTop 位置的数值的参数。否则它将像您需要获取 scrollTop 位置一样工作。

最后两种方法应该在所有浏览器中始终有效，而第一种方法可能不适用于某些版本的 IE。

于 2012-05-24T21:23:46.817 回答
2

由于没有人提到所需的 HTML，我将在此处添加它。

首先创建你的锚元素：

<a href="#" title="Scroll to Top" class="ScrollTop">Scroll To Top</a>

请注意，该类由以下 jQuery 引用。

然后添加你的jQuery：

$(document).ready(function(){
  $('.ScrollTop').click(function() {
    $('html, body').animate({scrollTop: 0}, 800);
  return false;
    });
});

要调整动画的速度，请更改“800”值。

于 2014-05-28T21:45:16.380 回答
0

这是跨浏览器的方式，

function scrollableElement(els) {
    for (var i = 0, argLength = arguments.length; i <argLength; i++) {
        var el = arguments[i],
        $scrollElement = $(el);
        if ($scrollElement.scrollTop()> 0) {
            return el;
        } else {
            $scrollElement.scrollTop(1);
            var isScrollable = $scrollElement.scrollTop()> 0;
            $scrollElement.scrollTop(0);
            if (isScrollable) {
                return el;
            }
        }
    }
    return [];
}

var scrollElem = scrollableElement('html', 'body');

$(scrollElem).scrollTop(0);

来自 css-tricks 的代码

于 2012-05-24T21:31:41.993 回答