建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

轻量级页面滚动视觉差特效JQuery插件paroller.js

来源:易助科技网浏览量:21收藏

简介


paroller.js 是一款轻量级的页面滚动视觉差特效 jquery 插件。该 jquery 插件可以在页面滚动时,使指定的图片元素产生炫酷的视觉差效果。您可以将其用于具有背景属性的元素或任何其他元素,滚动元素可以移动: 垂直、水平通过 html 数据 * 属性或 jquery 选项进行操纵,该插件兼容移动端,使用简单。


轻量级页面滚动视觉差特效JQuery插件paroller.js-示例图



使用


1.  引入jquery.js和jquery.paroller.js文件。


2.  HTML


<div data-paroller-factor="-0.1" data-paroller-type="foreground" data-paroller-direction="horizontal">


3.  调用


在页面 DOM 元素加载完毕之后,可以通过下面的方法来初始化该 jquery 视觉差插件。


$(window).paroller();


或在初始化时指定参数:


$(window).paroller({ factor: '0.5', type: 'foreground', direction: 'horizontal' });


4.  参数配置


data-*参数 默认值描述
data-paroller-factor0 设置元素的偏移和速度。值在 0.3 到-0.3 之间。
data-paroller-type   background   背景元素还是前景元素:background, foreground。  
data-paroller-direction vertical视觉差的方向:vertical, horizontal。  



相关链接


官网地址 :  http://paperjs.org/

Github 地址 : https://github.com/tgomilar/paroller.js

演示地址 :https://www.umming.com/demo/paroller/