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。