如何利用jquery显示鼠标点页面出现水波纹特效,下面编程教程网小编给大家简单介绍一下具体实现代码!
具体代码如下:
$(document).click(function(e) {
var size = 120
$('body').append("<div class='wave'>")
$('.wave').css({
position: 'fixed',
left: e.clientX,
top: e.clientY,
borderRadius: size + 'px',
border: '1px solid black',
}).stop().animate({
width: size,
height: size,
left: e.clientX - size / 2,
top: e.clientY - size / 2,
opacity: '0'
}, function() {
$('body .wave').remove()
})
})
以上是编程学习网小编为您介绍的“jquery鼠标点页面出现水波纹特效”的全面内容,想了解更多关于 前端知识 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:jquery鼠标点页面出现水波纹特效


猜你喜欢
- vue+springboot图片上传和显示的示例代码 2023-12-24
- uniapp改变底部安全区顶部手机信号时间电池栏颜色样式 2024-01-17
- vue-music关于Player播放器组件详解 2023-12-24
- 使用PHP从MySQL DB更新HTML组合框 2023-10-26
- JavaScript中的location、history、navigator对象实例介绍 2023-07-10
- css如何实现文字强制不换行(自动换行) 2024-12-13
- 深入解读CSS3中transform变换模型的渲染 2024-01-04
- 创建Vue3.0需要安装哪些脚手架 2025-01-14
- 前端存储方法对比之indexedDB 2025-01-20
- 一文彻底理清session、cookie、token的区别 2024-03-01