Jquery：从当前位置向下滚动页面 100px [重复]答案

【问题标题】：Jquery: scroll page down 100px from where it currently is [duplicate]Jquery：从当前位置向下滚动页面 100px [重复]
【发布时间】：2011-02-03 07:19:53
【问题描述】：

如何使页面从当前位置向下移动 100 像素？

我的代码不起作用：

    $('html,body').animate({
        scrollTop: $(window).position().top + 100
    })

像这样，但没有将页面滚动到特定元素，而是从窗口当前位置滚动 100 像素：

$('html, body').animate({
scrollTop: $("#scrollToHere").offset().top
}, 2000);

【问题讨论】：

您可以编辑您的问题。请不要转发。
是的，抱歉，我试图删除它，但我现在不能。

标签： jquery scroll scrolltop

【解决方案1】：

scrollTop 属性告诉您从顶部开始放置元素的位置。您必须使用 window.scrollBy 方法和 window.scrollY 属性。不幸的是，您不能在 window.scrollY 属性上使用动画，因为它是只读的。

你应该可以使用这样的东西：

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);

速度与移动的像素数量有关。稍后我会尝试更新它。

【讨论】：

呵呵，第一次点赞，第一次评论，快十年了。不错的代码，伙计，谢谢。

【解决方案2】：

想到了scrollto插件：
http://flesler.blogspot.com/2007/10/jqueryscrollto.html
http://demos.flesler.com/jquery/scrollTo/

但也许这有点矫枉过正:)

【讨论】：