更新时间:2021-12-20 00:00:42
惯性滚动和视差效果插件
您可以使用 npm 安装它:
1 | npm install luxy.js --save |
或者只是在您的页面中包含脚本:
1 | <script src="path/to/luxy.js" charset="utf-8"></script> |
在您的项目中包含 luxy.js 并初始化:
1 2 3 | <script charset="utf-8"> luxy.init();</script> |
使用包装器选项中指定的元素包装整个内容。请排除固定元素。
1 2 3 | <div id="luxy"> ... 全部内容</div> |
将 .luxy-el 添加到要指定视差效果的元素。
1 2 3 | <div id="luxy"> <div class="luxy-el"></div></div> |
使用 data-speed-y 属性指定视差效果的速度,使用 data-offset 属性指定偏移量。
1 2 3 | <div id="luxy"> <div class="luxy-el" data-speed-y="5" data-offset="-50"></div></div> |
如果要水平移动,指定 data-horizontal="1" 并使用 data-speed-x 属性指定水平方向的速度。
1 2 3 | <div id="luxy"> <div class="luxy-el" data-horizontal="1" data-speed-x="-5"></div></div> |
| 名称 | 默认 | 描述 |
|---|---|---|
| wrapper | '#luxy' | 整个内容包装元素。 |
| targets | '.luxy-el' | 视差效果针对元素。 |
| wrapperSpeed | 0.08 | 惯性滚动速度。 |
特别申明:
本站所有资源都是由网友投稿发布,或转载各大下载站,请自行检测软件的完整性!
本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!
如有侵权请联系我们删除下架,联系方式:lei1294551502@163.com