这个问题在这里已有答案:
如何将页面设置为距当前位置100px?
我的代码不起作用:
$('html,body').animate({
scrollTop: $(window).position().top + 100
})
像这样,但没有它将页面滚动到特定元素,而是从窗口当前位置滚动100px:
$('html, body').animate({
scrollTop: $("#scrollToHere").offset().top
}, 2000);
想到了scrollto插件: http://flesler.blogspot.com/2007/10/jqueryscrollto.html http://demos.flesler.com/jquery/scrollTo/
但也许这有点矫枉过正:)
scrollTop属性告诉您元素从顶部放置的位置。您必须使用window.scrollBy方法和window.scrollY属性。遗憾的是,您无法在window.scrollY属性上使用animate,因为它是只读的。
你应该可以使用这样的东西:
function animateScrollBy (x, y, interval) {
var xpos = 0,
ypos = 0,
updateScroll = function () {
var moveX = xpos <= x ? 1 : 0,
moveY = ypos <= y ? 1 : 0;
window.scrollBy(moveX, moveY);
xpos += 1;
ypos += 1;
if (moveX === 0 && moveY === 0) {
clearInterval(scrollInterval);
}
},
scrollInterval = null;
scrollInterval = setInterval(updateScroll, interval||1)
}
animateScrollBy(0, 100);
速度与移动的像素数量相关。我稍后会尝试更新它。