使用到的工具：jQuery Ripples Plugin

$(function() {

$('.pool').ripples({

	  resolution: 512,

	  dropRadius: 20,

	  perturbance: 1,

	});

});

点击查看效果

需要注意的是

  • 该工具不能用在移动端上
  • 该工具只能作用在有背景图片的元素中

使用js实现水波效果的更多相关文章

  1. canvas三角函数模拟水波效果

    .katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...

  2. React.js实现原生js拖拽效果及思考

    一.起因&思路 不知不觉,已经好几天没写博客了...近来除了研究React,还做了公司官网... 一直想写一个原生js拖拽效果,又加上近来学react学得比较嗨.所以就用react来实现这个拖 ...

  3. 用js实现动画效果核心方式

    为了做好导航菜单,有时候需要在菜单下拉的时候实现动画效果,所以这几天就研究了研究如何用js实现动画效果,实现动画核心要用到两个函数,一个是setTimeOut,另一个是setInterval. 下边我 ...

  4. js拖拽效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 原生JS实现分页效果2.0（新增了上一页和下一页，添加当前元素样式）

    虽然写的很烂,但至少全部都是自己写的,因为这个没有固定的顺序,所以就没有封装,如果你技术好的话,可以你写的分享给我,谢谢. <!DOCTYPE html><html lang=&qu ...

  6. 原生JS实现分页效果1.0

    不太完整,写的太急,等等加上完整注释,写起来还是有些难度的,写的有点水,后面再改进改进. <!DOCTYPE html><html lang="en">&l ...

  7. iOS 水波效果

    将水波效果放在子视图上,主控制器只负责加载 #import "WaveProgress.h" @interface WaveProgress () @property (nonat ...

  8. 使用JS实现手风琴效果

    想要实现简单的手风琴切换效果,需要使用JS实现,如下是使用javascript源码实现,后续会更新使用jQuery实现. 1. 先进行简单的布局:我们可以再ul下添加几个li实现html的简单布局,再 ...

  9. js弹窗登录效果(源码)--web前端

    1.JS弹窗登录效果 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

随机推荐

  1. jQuery UI vs Kendo UI & jQuery Mobile vs Kendo UI Mobile

    jQuery UI vs Kendo UI http://jqueryuivskendoui.com/#introduction jQuery Mobile vs Kendo UI Mobile ht ...

  2. Java 的基本语法

    Java 语言严格区分大小写 一个 Java 源文件里可以定义多个类,但其中只能有一个类被定义为 public 类 如果源文件中包含了 public 类,源文件的名称必须和该 public 类同名 p ...

  3. windows中git输错密码后不能重新输入的问题

    当输入密码错误后,git会把密码保存在windows的你的当前用户名的缓存中. 我们可以在控制面板中寻找到这个缓存,再删掉就可以了. 首先,打开“控制面板”,把“查看方式”改为“大图标”,再打开“用户 ...

  4. xcopy 命令行

    https://www.cnblogs.com/yang-hao/p/6003308.html xcopy-参数详解   XCOPY——目录复制命令  1．功能:复制指定的目录和目录下的所有文件连同目 ...

  5. java中常用的时间操作

    最近项目设计时间的转换和计算,长时间没用时间操作了,感觉手有点生,所以在这里记录一下: Date 常用的方法: getTime() .setTime(): SimpleDateFormate 常用的方 ...

  6. ffmpeg添加水印的方法举例 (砖)

    网上大部分关于ffmpeg加视频水印的方法还是使用vhook,在现在的ffmpeg中已经不推荐使用,但是也能编译,也能使用,至于效果,一会再说.现在的ffmpeg推荐使用的是libavfilter,但 ...

  7. 【Java基础专题】编码与乱码(05)---GBK与UTF-8之间的转换

    原文出自:http://www.blogjava.net/pengpenglin/archive/2010/02/22/313669.html 在很多论坛.网上经常有网友问" 为什么我使用 ...

  8. ROS与Matlab系列：一个简单的运动控制

    ROS与Matlab系列:一个简单的运动控制 转自:http://blog.exbot.net/archives/2594 Matlab拥有强大的数据处理.可视化绘图能力以及众多成熟的算法函数,非常适 ...

  9. C++面向对象类的实例题目二

    题目描述: 编写一个程序,设计一个产品类Product,其定义如下: class Product { public: Product(char *n,int p,int q); //构造函数 ~Pro ...

  10. 【摘自张宴的"实战:Nginx"】nginx配置

    user nobody;worker_processes 2; #error_log logs/error.log;error_log logs/error.log notice;#error_log ...