jQuery scrollTo

Question

$(document).ready(function() {
    $("#contact_menu").click(function() {
        $(body).scrollTo("#contact", 800);  
    }); 
}); 

我在我的代码中输入了这个，希望能让我的页面滚动，但是它不起作用。我尝试了几种方法，但是都做不对。

希望有人能够帮助我。

- Johan

---

你能发布你的HTML吗？ - Brad M

马上就来。 - Johan

$(body)是什么？也许你的意思是$('body')？ - Sergey Snegirev

当然可以，但这并不能解决问题。 - Johan

Answer 1

试试这个：

$("#contact_menu").click(function() {
        $("body").animate({
         scrollTop: $("#contact").offset().top
     }, 2000);
}); 

jsFiddle: http://jsfiddle.net/hescano/43umh/

您是否在尝试使用这个插件？http://demos.flesler.com/jquery/scrollTo/

- Hanlet Escaño

---

是的，我正在尝试那个，但不确定它是否是一个插件。 - Johan

@Johan - 一个好的方法是通过谷歌搜索"jquery scrollto"来找到答案。如果该函数不需要插件，第一个结果将直接带您进入jQuery文档。如果需要插件，则前几个搜索结果应该很明显。通常情况下，每当您对一个函数有疑问时，您应该立即谷歌搜索"jquery FUNCTION_NAME"。 - jahroy

我认为Firefox要求您对$（“html”）进行动画处理。这就是为什么大多数有关动画滚动的教程都将$（“html，body”）作为要进行动画处理的对象的原因。参考：https://dev59.com/RWHVa4cB1Zd3GeqPpbMZ - user166560

Answer 2

如果你想使用jQuery来滚动到某个位置，建议使用.scrollTop方法：

$(document).ready(function() {
    var pos = $('#contact').position();
    $("#contact_menu").click(function() {
        $(body).animate({scrollTop:pos.top},800);  
    }); 
}); 

- PlantTheIdea

---

终于有东西可以用了！谢谢！ - Anthony

Answer 3

尝试一下

$(document).ready(function() {
    $("#contact_menu").click(function() {
        $('body, html').animate({ scrollTop: $("#contact").offset().top }, 800);
    });
});

- user166560

Answer 4

我不知道关于“scrollTo”函数，但如果它确实存在，问题可能在选择器中。根据浏览器的不同，您必须动画显示body或html对象。我通常用以下方法来动画显示scrollTop：

$('html,body').animate({ scrollTop: $('#contact').position().top+'px'}, 400, function() {})

请注意，我选择了400毫秒的持续时间，但您可以使用任何您想要的值。最后一个“function()”参数是回调函数，这意味着当动画完成时它会被调用。希望这能帮助到您。

- Bene

---

是的，你说得对，scrollTo方法不存在了，或者说可能不再存在了，但是Hanlet的答案解决了这个问题。 - Johan

@Johan - 使用 scrollTo() 需要插件. 但使用 scrollTop() 不需要。 - jahroy

而且 .scrollTop() 不会产生动画效果，.animate({scrollTop : value}) 则会！ - Bene