[英]jQuery scrollTop - animation not working
Using the example found here , I'm trying the implement the same.使用此处找到的示例,我正在尝试使用相同的工具。 When I click on a navigation link, it jumps to the selected div instead of sliding/scrolling.
当我点击导航链接时,它会跳转到选定的 div 而不是滑动/滚动。
HTML: HTML:
Navigation导航
<div class="span3">
<a href="#about-me"><img class="img-circle" src="http://placehold.it/200x200/e36b23/fff/&text=About+Me+"></a>
</div>
DIV DIV
<div class="row-fluid" id="about-me"> ... </div>
JS: JS:
<script>
$(document).ready(function(){
$('nav ul li a').click(function(){
var el = $(this).attr('href');
var elWrapped = $(el);
scrollToDiv(elWrapped,40);
return false;
});
function scrollToDiv(element, navheight){
var offset = element.offset();
var offsetTop = offset.top;
var totalScroll = offsetTop - navheight;
$('body,html').animate({
scrollTop: totalScroll
}, 1000);
}
});
</script>
So it's getting to the 'clicked' div but not with the slide animation - which is what I want.所以它进入“点击”div,但不是幻灯片动画 - 这就是我想要的。 Anyone have any ideas?
谁有想法?
You do not prevent default behavior, which is to navigate ("jump") directly to the anchor point.您不会阻止默认行为,即直接导航(“跳转”)到锚点。 So here it goes:
所以这里是这样的:
$('nav ul li a').click(function(evt){
evt.preventDefault();
...
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.