use*_*443 5 javascript jquery smooth-scrolling twitter-bootstrap-3
早上好,
好吧我正在使用Bootstrap 3来构建我的网站 - 想要使用锚定标签上的scrollTop平滑滚动来完善它.无法让它为我的生活而工作.
所以这是我的代码:
<script type="text/javascript" src="js/animate.js"></script>
<body>
<div id='imgDiv'>
<div class="container">
<center>
<a href="#imgDiv2"><h2>my link</h2></a>
</center>
</div>
</div>
<a href="">
<div id='imgDiv2'></div>
some content here
</div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
这是animate.js中的脚本
// JavaScript Document
$(document).ready(function() {
$('a[href^="#"]').click(function() {
var target = $(this.hash);
if (target.length == 0) target = $('a[name="' + this.hash.substr(1) + '"]');
if (target.length == 0) target = $('html');
$('html, body').animate({ scrollTop: target.offset().top }, 500);
return false;
});
});
所以它确实锚定到名为imgDiv2的div id但不使用平滑滚动动画,任何想法？
您需要animate.js在 jQuery 之后包含，因为您的 jQuery 代码animate.js需要 jQuery 核心库才能工作：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/animate.js"></script>