HTML5中国

 找回密码
 立即注册

QQ登录

只需一步,快速开始

HTML5中国 首页 资源下载 开源代码 查看内容

rellax-纯js轻量级滚动视觉差特效插件

2016-11-8 13:28| 发布者: microHTML| 查看: 980| 评论: 0|来自: jQuery之家

摘要: rellax.js是一款轻量级的纯JavaScript滚动视觉差特效插件。rellax.js压缩后的版本仅871个字节,在手机等小屏幕设备中,插件会自动限制视觉差特性。

插件下载:http://down.htmleaf.com/1608/201608101451.zip


简要教程


rellax.js是一款轻量级的纯JavaScript滚动视觉差特效插件。rellax.js压缩后的版本仅871个字节,在手机等小屏幕设备中,插件会自动限制视觉差特性。


安装


可以通过npm来安装rellax.js视觉差插件。


npm install rellax


使用方法


在页面中引入rellax.min.js文件。



HTML结构


为你需要设置视觉差效果的元素添加.rellax class类。然后通过data-rellax-speed属性来设置该元素的相对滚动速度。数值越大,滚动的越快。


I’m that default chill speed of "-2"
I’m super fast!!
I’m extra slow and smooth


初始化插件


在页面的底部,标签之前添加下面的代码来初始化rellax.js视觉差插件。



rellax.js视觉差特效插件的github地址为:https://github.com/dixonandmoe/rellax


原文链接:http://www.htmleaf.com/jQuery/shijuecha/201608103846.html

原作者:jQuery之家


本站文章均由 HTML5中国 编辑从其他媒体精选HTML5相关文章转载,仅供网友学习和交流,如果我们的工作有侵犯到您的权益,请及时联系站长QQ:2601929995,我们会在第一时间进行处理!

投稿: admin@html5cn.org


鲜花

握手

雷人

路过

鸡蛋

相关阅读

最新评论

HTML5中国微信

小黑屋|关于我们|HTML5论坛|友情链接|手机版|HTML5中国 ( 京ICP备11006447号 京公网安备:11010802018489号  

GMT+8, 2017-6-27 08:14

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

返回顶部