rellax.js是一款轻量级的纯JavaScript滚动视觉差特效插件。rellax.js压缩后的版本仅871个字节,在手机等小屏幕设备中,插件会自动限制视觉差特性。
rellax.js的安装
可以通过npm来安装rellax.js视觉差插件。
npminstallrellax
rellax.js的使用方法
在页面中引入rellax.min.js文件。
HTML结构
为你需要设置视觉差效果的元素添加.rellaxclass类。然后通过data-rellax-speed属性来设置该元素的相对滚动速度。数值越大,滚动的越快。
I’mthatdefaultchillspeedof"-2"
I’msuperfast!!
I’mextraslowandsmooth
初始化插件
在页面的底部,
标签之前添加下面的代码来初始化rellax.js视觉差插件。
//Acceptsanyclassname
varrellax=newRellax('.rellax');
总之,rellax.js给大家简单的介绍了一些,希望大家多看看。