获取window.scrollTo(0,0);上班

时间:2016-01-20 10:45:48

标签: javascript jquery html scrollto

我知道这个问题可能被问到并解决了一千次,但我需要就我的具体案例提出建议。

我在我的网站上设置了几个锚点,我正在使用jquery在它们之间平滑滚动。我一直在使用#top锚点滚动到页面顶部并且它可以正常工作。但问题是,如果我让按钮滚动到#top,它将不会滚动到页面的绝对顶部(因为我无法在网页上设置足够高的锚点)。

我尝试使用window.scrollTo(0, 0);命令工作,但我不知道如何让它工作,同时仍然可以滚动到锚点。

我使用以下jQuery进行锚点滚动:

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();
        var target = this.hash;
        var $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

使用此HTML:

<a href="#top">
    <img alt="" heigth="60" onmouseout="this.src='http://i.imgur.com/0JvWWER.png'" onmouseover="this.src='http://i.imgur.com/Ow7CVn0.png'" src="http://i.imgur.com/0JvWWER.png" width="60" />
</a>

现在,我如何让window.scrollTo(0,0);工作,如何在html体中实现它?

提前致谢。

1 个答案:

答案 0 :(得分:1)

正如somethinghere所说,在这里做一个小改动:

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();
        var target = $(this).attr("href");

        $('html, body').stop().animate({
            // Change here...
            'scrollTop': ((target === '#top') ? 0 : $(target).offset().top)
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});