jquery.ripple.js是一款小巧的基于HTML5 Canvas的水波涟漪jQuery插件。该插件可以在一张图片上，通过鼠标点击制作出逼真的水波涟漪效果。

使用方法

在页面中引入jquery和jquery.ripple.js文件。

<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery.ripple.js" type="text/javascript"></script>                  
                

HTML结构

该插件可以为任何一张图片制作水波涟漪特效。

<img id="target" src="img/1.jpg">  
                

初始化插件

在页面DOM元素加载完毕之后，可以通过ripple()方法来初始化该水波涟漪特效插件。

$(function() {
    $("#target").ripple();
});
                

jquery.ripple.js水波涟漪插件的github地址为：https://github.com/jtiscione/ripple。

在线预览    源码下载