scrollTo函数在JSfiddle中运行顺畅但在我的页面上不顺畅

Question

因此，scrollTo（）滚动到我页面的正确部分。那不是问题。它立即出现在那里。我打算向你展示这个问题，但发现它在那里工作。您可以在以下JSFiddle中看到我的页面上没有“渐进式”滚动。

http://jsfiddle.net/8xK8x/1/

$('.scrollto').click(function(e) {
   var elementClicked = $(this).attr("href");
   var destination = $(elementClicked).offset().top;
   $("#main").animate({ scrollTop: parseInt($("#main").scrollTop() + destination)} );
   e.preventDefault();
});

如果你知道为什么会这样，请随意指出我正确的方向。我还将我的头标记信息包含在那个小提琴中。

您可以在此处查看我正在使用的网站：http://afrohorse.netau.net/test/

Answer 1

在你的小提琴中，嵌入了脚本代码，以便在页面加载时执行 - 而在你的站点中，你只是在那里执行它然后，然后，你所针对的元素甚至不存在，因为它们位于DOM树的下方（所以没有事件处理程序实际上绑定到任何东西）。

使代码也在页面加载时执行（将其包装到$(function() { … });），
或者在DOM中的元素之后进一步向下移动，
或以“实时”方式使用.on（请参阅jQuery文档）。