web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置:
首页
>
网页特效
>
动画效果
jQuery UI炫酷雨滴落在水面上的波纹涟漪特效
分类:
动画效果
日期:
2024-05-14
点击(0)
评论(0)
演 示
免费下载
简介
该特效依赖于jQuery UI,使用时要引入jQuery,jQuery UI和raindrops.js文件。 ```html ``` ##### HTML结构 制作该雨滴落在水面上的特效使用一个空的div即可。 ```html
``` ##### 初始化插件 在页面加载完毕之后可以使用下面的方法来初始化该特效。 ```html jQuery('#example').raindrops(); ``` ##### 配置参数 下面是该雨滴落在水面上的特效的一些可用配置参数。 | 参数 | 默认值 | 描述 | | ------------ | ------------ | ------------ | |color|'#00aeef'|水面的颜色| |waveLength|340|波浪的长度。数值越大波浪越短| |frequency|3|雨滴落下的频率,数值越大频率越高| |waveHeight|100|数值越大波浪的高度越高| |density|0.02|水的密度。数值越大水波涟漪越短| |rippleSpeed|0.1|水波涟漪的速度。数值越高水波涟漪越快| |canvasWidth|100%|水面的宽度。默认值100%表示等于父容器的宽度| |canvasHeight|50%|水面的高度。默认值50%表示父容器的一半| |rightPadding|20|屏蔽有动画插件的不需要的间隙| |position|'absolute'|画布的位置| |positionBottom|Bottom = 0|画布的位置| |positionLeft|Left = 0|画布的位置|
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告