修改

Question

我已经在我的网站上编写了一个平滑滚动的脚本，但它似乎没有用，但其他声称它有效。（使用最新的chrome版本，没有尝试过不同的浏览器）。有什么建议可能是这样的吗？我在下面的html页面中链接了脚本。

HTML：

<a id="top"></a>
**page content here**
<a href="#top">Go to top</a>

脚本：

$(document).ready(function() {
    $('a[href^="#"').click(function() {
        var target = $(this.hash);
        if (target.length == 0) target = $('a[name="' + this.hash.substr(1) + '"]');
        if (target.length == 0) target = $('html');
        $('html, body').animate({ scrollTop: target.offset().top }, 500);
        return false;
    });
});

Answer 1

可能是jQuery版本问题，这个.hash在1.7.2中不起作用（正如我注意到的）

hash是一个可以在包含href属性/属性的元素上找到的属性。

Answer 2

似乎没有问题，但您的选择器不正确：

$('a[href^="#"') // Wrong but jQuery appears to deal with it
$('a[href^="#"]') // Right

修改

考虑到您使用旧版本的jQuery（2008年为1.2.6），实际上可能是问题所在：

$('a[href^="#"') // jQuery 1.2.6 in your page returns an empty set
$('a[href^="#"]') // Works with 1.2.6 : one anchor element in the set

Answer 3

您的代码似乎在简单的设置中正常工作，但我之前在Chrome中遇到过类似的问题。特别是如果你的HTML很复杂。 Chrome有时不会承认视口需要重新绘制。当我发生这种情况时，我会在动画的每一步对DOM做出一个非常明显的改变，这应该强制重绘。像这样：

$("body").toggleClass("redraw");

我为你做了fiddle。

也许它有所帮助，也许它没有：）

jQuery平滑滚动无法正常工作

3 个答案:

修改