做网站|网站建设,就上易助科技网

前端技术文档及相关资料下载

关于前端html、css、js等技术上的各种疑难棘手问题的解决方案探讨及相关资料下载!

JQuery轻量级页面滚动视觉差特效插件paroller.js
来源:易助科技网浏览量:10收藏

简介

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


使用

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-factor  设置元素的偏移和速度。值在 0.3 到-0.3 之间。
data-paroller-type   background   背景元素还是前景元素:background, foreground。   
  data-paroller-direction  vertical视觉差的方向:vertical, horizontal。   


相关链接

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

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