最近想要在按钮上添加material design的点击效果，看了看muse-ui，单纯的想要这种效果，而要引入一些不必要的内容觉得不划算，然后自己动手造了个轮子。
项目地址：github

上传不了gif图只能用 JSFiddle了： JSFiddle效果

Import using script tag

<link rel="stylesheet" href="./ripple.css" charset="utf-8">
<script src="./ripple.js"></script>

使用

    <button class="md-button">文字</button>

    new Ripple({
            cName: 'md-button',
            color: 'red',
            time: '0.5s',
            MaxNum: 5
        })

只要在<button>内添加 class='className' 并且在 Ripple()内传入{cName: 'className'},便可以实现水波纹效果。<button> 的position将会被设置为relative

配置参数

Option	Description
cName	element的className，默认为 "md-button"
r	水波纹最小半径，不传此参数则为自动计算
color	水波纹颜色默认为：rgba(0, 0, 0, 0.3)
time	animation的时间默认为：0.5s
MaxNum	水波纹的最大数量默认为：5
center	水波纹的圆心。默认为：false
zIndex	设置z-index 默认为：null,当水波纹被覆盖时，可以使用此参数