相对于当前位置 Jquery 滚动

Scroll relative to current position Jquery

本文关键字：Jquery 滚动 位置 相对于      更新时间：2023-09-26

在使用jquery单击元素时，我正在尝试相对于其当前位置滚动div。但它必须在 3000 毫秒后滚动，所以试图延迟它。现在，单击后，它会相对于顶部立即滚动 300 像素。如果我再次单击，则没有任何反应。

这是到目前为止的代码：

$('#scroll').click(function(){              
            $('.vluchtelinginfo').delay(3000).scrollTop(+300);
        });

感谢您的帮助。

Brad M关于使用setTimeout的建议是获得所需内容的一种方法。 scrollTop()没有列在jQuery提供的"效果"中，因此不会受到delay()的影响，因为delay()只影响效果。

但是，可以使用animate()来制作滚动效果，例如，以下内容应为滚动设置动画：

$scrollable.animate({scrollTop: x});

由于animate()是一种"效果"，因此应该受到delay()的影响。所以你可以做：

$scrollable.delay(3000).animate({scrollTop: x});

但是，您遇到了另一个问题：当调用scrollTop(x)时x是绝对值，而不是相对值。调用scrollTop(+300)与调用scrollTop(300)完全相同。+符号在这种情况下没有特殊含义。如果您希望滚动是相对的，则需要首先获取上一个 scrollTop 值，并向其添加要滚动的相对距离。例如

$scrollable.delay(3000).animate({scrollTop: $scrollable.scrollTop() + 300});

这个小提琴使上述原则发挥作用。

这不是

delay()的工作方式。

在您的情况下，请使用 

setTimeout(function() {
    $('.vluchtelinginfo').scrollTop(+300);
});

根据delay()的文档

只有队列中的后续事件才会延迟;例如，这将 不延迟 .show(( 或 .hide(( 的无参数形式，它们不会 使用效果队列。

你可以尝试这样的事情...

$("#scroll").click(function () {
    setTimeout(function () {
        $(".vluchtelinginfo").css("top", $(".vluchtelinginfo").offset().top + 300);
    }, 3000);
});
相关文章：