Smooth scroll to div id jQuery
I've been trying to get a scroll to div id jquery code to work correctly. Based on another stack overflow question i tried the following
DEMO http://jsfiddle.net/kevinPHPkevin/8tLdq/
$('#myButton').click(function() {
$.scrollTo($('#myDiv'), 1000);
});
But it didn't work. It just snaps to the div. I also tried
$('#myButton').click(function(event) {
event.preventDefault();
$.scrollTo($('#myDiv'), 1000);
});
With no progress.
You need to animate the html, body
DEMO http://jsfiddle.net/kevinPHPkevin/8tLdq/1/
$("#button").click(function() {
$('html, body').animate({
scrollTop: $("#myDiv").offset().top
}, 2000);
});
如果您想要在页面上覆盖标准的href-id导航而不更改平滑滚动的 HTML标记,请使用以下示例:
// handle links with @href started with '#' only
$(document).on('click', 'a[href^="#"]', function(e) {
// target element id
var id = $(this).attr('href');
// target element
var $id = $(id);
if ($id.length === 0) {
return;
}
// prevent standard hash navigation (avoid blinking in IE)
e.preventDefault();
// top position relative to the document
var pos = $id.offset().top;
// animated top scrolling
$('body, html').animate({scrollTop: pos});
});
here is my 2 cents:
Javascript:
$('.scroll').click(function() {
$('body').animate({
scrollTop: eval($('#' + $(this).attr('target')).offset().top - 70)
}, 1000);
});
Html:
<a class="scroll" target="contact">Contact</a>
and the target:
<h2 id="contact">Contact</h2>
链接地址: http://www.djcxy.com/p/49642.html
上一篇: 在android中从SQLite数据库请求多个单元格
下一篇: 平滑滚动到div id jQuery