【问题标题】:Can someone explain to me how setting a set amount of pixels the scroll function can scroll down/up to using jquery works?有人可以向我解释一下如何设置滚动功能可以向下/向上滚动到使用 jquery 的像素数量吗?
【发布时间】:2017-06-08 12:16:29
【问题描述】:
$(window).scroll(function(){
// scroll 100vh down on first scroll

// scroll another 100vh down on second scroll
})

我见过一个插件可以做到这一点,但我希望能够理解逻辑是如何工作的。有人可以向我解释一下,或者至少给我指出一个可以进一步解释的网站吗?

【问题讨论】:

标签: javascript jquery css scroll transform


【解决方案1】:
$(window).scroll(function(){ //Function called when window is scrolled.

})

JQuery Scroll

当用户滚动到一个元素时,滚动事件被发送到一个元素 元素中的不同位置。它适用于窗口对象,但也适用于 到具有溢出 CSS 属性集的可滚动框架和元素 滚动(或当元素的显式高度或宽度小于时自动滚动 大于其内容的高度或宽度)。

当 div 的宽度/高度大于设备浏览器的可用宽度/高度时,将为您提供滚动条以向下滚动并查看溢出的元素。

Jquery 滚动允许您在用户在提供的选择器内滚动时监听事件。

它将调用您作为参数传递给 jquery 滚动函数的处理程序(函数)。

此外,您无需手动滚动容器。浏览器会自动滚动溢出容器的内容,但您可能需要增加滚动条的滚动步长。

如何增加步长?

通常,当您滚动时,可滚动容器的 scrollTop 属性会以固定步长 (1-10 像素) 发生变化。

这个scrollTop 属性决定有多少内容从可滚动容器顶部溢出,并从容器底部显示更多像素,就像一个视口。

因此,您可以向scrollTop 添加更多像素并滚动比默认值更多。

查看我的answer

【讨论】:

  • 究竟如何增加滚动的步长?因为我需要知道如何将鼠标滚轮向下轻弹一下才能将页面精确地向下移动 100vh,即 fullPage.js
  • 我不太清楚发生了什么,我很新,如果不是太多,你能详细解释一下吗?动画似乎也有问题
猜你喜欢
  • 2012-09-22
  • 2014-04-20
  • 2011-04-24
  • 1970-01-01
  • 2012-04-09
  • 2019-11-28
  • 2023-02-08
  • 2019-07-28
  • 1970-01-01
相关资源
最近更新 更多