web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置:
首页
>
网页特效
>
图片特效
jQuery超酷动感模糊图片视觉差特效
分类:
图片特效
日期:
2024-05-14
点击(0)
评论(0)
演 示
免费下载
简介
使用该视觉差插件需要引入jQuery和jquery.parallax.js以及jquery.mCustomScrollbar.css文件。 ```html ``` ##### HTML结构 ```html
``` ##### 初始化插件 在页面加载完毕之后,可以通过下面的方法来初始化该视觉差插件。 ```html $('.container').parallax(options); ``` ##### 配置参数 下面是这个视觉差插件的可用参数: - imageSelector:图片的选择器,会在container中进行搜索。默认是img,该参数只会选择第一个匹配的元素。 - shadowCount:克隆图片的数量。默认是4。数字太大会影响性能。 - shadowOpacity:克隆图片的透明度。值在0(隐藏)到1(完全可见)之间。默认值:1 / (shadowCount + 1)。 - clipShadows:是否在图片容器上应用overflow: hidden,是克隆的图片不会溢出容器。默认值:true。 - hideOnMouseLeave:是否当鼠标离开图片容器的时候隐藏克隆的图片。默认值:true。 - hideOriginalImage:是否在创建克隆图片之后隐藏原来的图片。默认值:true。 - maxRotationDegree:图片的最大旋转角度,默认值是10。正数值会使图片接近鼠标,负数值会使图片远离鼠标。 - translateMultiplier:鼠标滑过图片时水平和垂直移动的数量,默认值为-10,这将图片的中心远离鼠标。 - imageScale:图片缩放的比例,默认值为1.1。 - perspective:CSS transform: perspective()的值。值越小效果越强烈。默认值为500。 - baseZetaIndex:在第一个克隆图片上使用的CSS z-index的值。 - transformOrigin:是否改变转换的原点。默认值为false。
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告