鼠标点击水波纹插件
1、引入js
<script src="ripple.js"></script>
2、调用
<script type="text/javascript">
new Ripple()
</script>
3、在需要添加效果的元素上加上: data-ripple="ripple"
<div data-ripple="ripple">
div标签
</div>
4、配置项
参数 | 数据类型 | 缺省值 | 说明 |
---|---|---|---|
opacity | number | 0.5 | 水波纹透明度 0.1 - 1 |
speed | number | 0.6 | 水波纹扩散速度 单位为秒 |
bgColor | string | #ffffff | 水波纹颜色 |
cursor | boolean | true | 是否显示手指鼠标指针 |
new Ripple({
opacity : 0.6, //水波纹透明度
speed : 1, //水波纹扩散速度
bgColor : "#ffffff", //水波纹颜色
cursor : false //是否显示手型指针
})
5、兼容性
不支持IE9及下版本