动画的Jquery返回页首

Question

我目前正在尝试创建一个按钮，该按钮会将用户带回到页面顶部，但具有动画效果。单击该按钮时，使页面滚动回到顶部。我在这里搜索，发现了这个 ..

我尝试使用以下方法对此做一个JSfiddle ...

的CSS

html {
margin:0;
padding:0;
height:2000px;
}

body {
height:2000px;   
}

#blue-box {
position:fixed;
width:100px;
height:70px;
margin-left:0px;
margin-top:50px;
background-color:blue;     
}

#blue-box h1{
font-family:Constantia;
font-size:20px;
text-align:center;
margin-top:5px;
color:#FFFFFF;
}

的HTML

<div id="blue-box">
<h1>Back To Top</h1>
</div>

的JavaScript

$(document).ready(function() {
var away = false;

$('#blue-box').click(function() {
$("html, body").animate({scrollTop: 0}, 500);
});

不幸的是，这似乎不起作用，我想知道我是否错过了某些事情或做错了明显的事情？

Answer 1

您在});脚本末尾缺少。添加它可以解决您的问题：

$(document).ready(function() {
    var away = false;

    $('#blue-box').click(function() {
        $("html, body").animate({scrollTop: 0}, 500);
    });
});  // <-- Here.

这就是为什么正确缩进代码很重要的一个很好的例子。这使这种错误更加难以错过。