【文件属性】：
文件名称：ScrollTrigger：让您的页面对滚动更改做出React
文件大小：117KB
文件格式：ZIP
更新时间：2021-02-03 04:26:12
javascript css animation html-element trigger
滚动触发
让您的页面对滚动更改做出React。
ScrollTrigger的最基本用法是根据当前滚动位置触发类。 例如，当元素进入视口时，将其淡入。您可以为每个元素添加自定义偏移量，或在视口上设置偏移量（例如，始终在元素达到视口的20％之后触发）
使用回调时，ScrollTrigger变得非常强大。 当元素进入/可见时，您可以运行自定义代码，如果回调失败，甚至可以返回Promises来停止触发器。 这使得延迟加载图像非常容易。
安装
npm install @terwanerik/scrolltrigger或仅将dist/ScrollTrigger.min.js文件添加到您的项目中并导入。
如何使用？
最简单的启动方法是创建一个新实例，并向其添加一些触发器以及所有默认值。 当元素进入视口时，这将切换“可见”类，当元素滚动出视口时，将切换“不可见”类。
// when using ES6 import / npm
import ScrollTrigger from '@terwanerik/scrolltrigger'
// Create a new ScrollTrigger
【文件预览】：
ScrollTrigger-master
----.babelrc(109B)
----package.json(2KB)
----.github()
--------workflows()
----LICENSE(1KB)
----package-lock.json(303KB)
----dist()
--------ScrollTrigger.js(34KB)
--------ScrollTrigger.min.js(12KB)
--------ScrollTrigger.min.js.map(40KB)
----src()
--------config()
--------extensions()
--------ScrollTrigger.js(6KB)
--------scripts()
----dev()
--------index.html(607B)
--------main.js(349B)
----.gitignore(39B)
----webpack.config.js(2KB)
----demo()
--------scene.js(2KB)
--------index.html(6KB)
--------canvas.js(816B)
--------main.js(8KB)
--------demo.css(3KB)
--------point.js(2KB)
----README.md(13KB)
----bower.json(639B)