插件描述：一款轻量级的纯Javript滚动视觉差特效插件
简要教程
rellax.js是一款轻量级的纯JavaScript滚动视觉差特效插件。rellax.js压缩后的版本仅871个字节，在手机等小屏幕设备中，插件会自动限制视觉差特性。
安装
可以通过npm来安装rellax.js视觉差插件。
1 | npm install rellax |
使用方法
在页面中引入rellax.min.js文件。
1 | <script type="text/javascript" src="js/rellax.min.js"></script> |
HTML结构
为你需要设置视觉差效果的元素添加.rellax class类。然后通过data-rellax-speed属性来设置该元素的相对滚动速度。数值越大，滚动的越快。
1 2 3 4 5 6 7 8 9 | <div class="rellax"> I’m that default chill speed of "-2"</div><div class="rellax" data-rellax-speed="7"> I’m super fast!!</div><div class="rellax" data-rellax-speed="-4"> I’m extra slow and smooth</div> |
初始化插件
在页面的底部，<body>标签之前添加下面的代码来初始化rellax.js视觉差插件。
1 2 3 4 | <script> // Accepts any class name var rellax = new Rellax('.rellax');</script> |
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： 背景全屏切换
- 下一个特效： jQuery全屏背景插件Vegas2