[英]Using .animate on scrollTop
如何在此代码段中添加.animate?
$("body,html").scrollTop($("#wrapper3").position().top);
我曾尝试加入.animate
前scrollTop
,但它一直显示在Dreamweaver中的错误。
任何帮助表示赞赏。
编辑:
HTML
<!DOCTYPE html>
<meta charset=utf-8>
<html lang="da">
<html>
<head>
<link href="_css/fddkStyles.css" rel="stylesheet" type="text/css" />
<link href="jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />
<script src="_jquery/jquery-1.10.1.min.js"></script>
<title>Title of the document</title>
</head>
<body>
<div id="wrapper">
<div id="bar16"></div>
</div>
<div id="wrapper2">
</div>
<div id="wrapper3">
</div>
<script src="_jquery/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="_jquery/TweenMax.min.js"></script>
<script src="_jquery/my.js" type="text/javascript"></script>
<script src="_jquery/jquery.scrollTo-1.4.3.1-min.js"></script>
</body>
</html>
JavaScript的
$(document).ready(function(e) {
$("#bar16").click(function() {
$("body,html").scrollTop($("#wrapper3").position().top);
});
});
目前尚不清楚您想要什么以及如何实现结果,但是如果我理解您的意思,您可以做到:
<h1 id="anchor">Lorem Ipsum</h1>
<p><a href="#anchor" class="topLink">Back to Top</a></p>
和jQuery:
$("a.topLink").click(function() {
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"}, {duration: 500, easing: "swing"
});
return false;
});
可以将#anchor更改为您想要的内容,并且“返回页首”将转到您的#anchor。 只需确保div(或本例中为h1)具有idenditcal id。
这是小提琴
跳转到页面顶部的可能原因是您尚未加载jQuery。 确保jQuery已加载。
编辑
好的,在您编辑完之后,只需更改一下即可
<div id="bar16"></div>
对此
<div id="bar16">
<a href="#wrapper3" class="topLink">CLICK HERE</a></div>
</div>
像这里: 小提琴
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.