在scrollTop上使用.animate [英] Using .animate on scrollTop
问题描述
如何在此代码段中添加.animate?
How do I go by adding .animate to this piece of code?
$("body,html").scrollTop($("#wrapper3").position().top);
我尝试在scrollTop
之前添加.animate
,但是它在Dreamweaver中始终显示错误.
I have tried adding .animate
before scrollTop
, but it keeps showing an error in 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
JavaScript
$(document).ready(function(e) {
$("#bar16").click(function() {
$("body,html").scrollTop($("#wrapper3").position().top);
});
});
推荐答案
目前尚不清楚您想要实现什么目标以及如何实现目标,但是如果我理解您的意思可以做到:
It's not very clear what and how you want to achieve your result, but if I understood what you meant you can do:
<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.
The #anchor can be changed to what you want and the "Back to Top" is going to go to your #anchor. Just make sure the div (or in this case h1) has an idenditcal id.
这是小提琴
跳转到页面顶部的可能原因是您尚未加载jQuery.确保已加载jQuery.
A POSSIBLE REASON for jumping to the top of the page is the fact you have NOT loaded jQuery. Make sure jQuery IS LOADED.
编辑
EDIT
确定,请在编辑后更改
<div id="bar16"></div>
对此
<div id="bar16">
<a href="#wrapper3" class="topLink">CLICK HERE</a></div>
</div>
就像这里:小提琴
这篇关于在scrollTop上使用.animate的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!