Question

我有这个问题，我的导航栏不会滚动到指定的div。我看过其他例子，但我似乎无法解决问题。

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script>
</head>

<li><a id="link1" href="#top-page">Intro</a></li>
<li><a id="link2" href="#about">About</a></li>
<li><a id="link3" href="#contact">Contact</a></li>

<script>
$("#link1").click(function() {
$('html, body').animate({
    scrollTop: $("#top-page").offset().top
}, 2000);
});
$("#link2").click(function() {
$('html, body').animate({
    scrollTop: $("#about").offset().top
}, 2000);
});
 $("#link3").click(function() {
$('html, body').animate({
    scrollTop: $("#contact").offset().top
 }, 2000);
 });
</script>

jsfiddle - http://jsfiddle.net/4c0r2gzv/

提前致谢

Answer 1

这是一个smoothscroll的脚本，我认为这就是你想要的：

$(function(){
    $(".scroll").click(function(){
        $("html,body").animate({scrollTop:$("#target").offset().top},"500");return false})
    });
});

将.scroll替换为您自己的类或使用.scroll。无论您使用哪个类，都必须应用于要单击的锚点。 #target设置目的地。使用您自己的ID或使用#target。 #target必须应用于目标。数字是动画以毫秒为单位完成所需的时间;把它改成你想要的任何东西。

用JS滚动到div

1 个答案: