jquery淡入淡出无延迟代码
2024-09-04 10:05:05
<!DOCTYPE html> <html> <head> <script src="jquery.js"></script> <script> $(document).ready(function(){ $("#button1").mouseover(function(){ $(".div1").stop().animate({opacity:1},1000); $(".div2").stop().animate({opacity:1},1000); $(".div3").stop().animate({opacity:1},1000); }); $("#button1").mouseleave(function(){ $(".div1").stop().animate({opacity:0},1000); $(".div2").stop().animate({opacity:0},1000); $(".div3").stop().animate({opacity:0},1000); }); }); </script> </head> <body> <button id="button1">鼠标放在这里,使三个矩形淡入</button> <div class="div1" style="width:80px;height:80px;opacity:0;background-color:red;"></div> <br> <div class="div2" style="width:80px;height:80px;opacity:0;background-color:green;"></div> <br> <div class="div3" style="width:80px;height:80px;opacity:0;background-color:blue;"></div> </body> </html>
另外
function () { $(".div1").animate({ 'opacity': 0 },{ queue: false, duration: 1000 }); },
function () { $(".div1").animate({ 'opacity': 1 }, { queue: false, duration: 1000 }); }
也可以。
最新文章
- ThreadLocal源码分析
- iOS企业级开发初级课程-UIView与控件(20集)
- 超强vim配置
- Apache + Tomcat + mod_jk实现集群服务及session共享
- 进度记录 和 安装imagick时Cannot locate header file MagickWand.h错误的解决
- 安装docker以及问题解决办法
- Linux开发黑客
- 如果解决小程序1024kb渲染之坑
- [sklearn] 官方例程-Imputing missing values before building an estimator 随机填充缺失值
- word简单优化--提高效率
- pip更新到18版本后使用pycharm更新问题:module &#39;pip&#39; has no attribute &#39;main&#39;
- ES6 变量的解构
- db 文件 查看 打开 工具 db 中文 版 navicat 中文
- 88个 Linux 系统管理员必备的监控工具
- 轻量级Modal模态框插件cta.js
- [spark 快速大数据分析读书笔记] 第一章 导论
- C学习笔记(2)--指针
- Groovy 与 DSL
- UVa 11178:Morley’s Theorem(两射线交点)
- OC-通知+Block
热门文章
- 漫谈网络通信——从OSI网络模型到TCP/IP协议族
- 洛谷 P1570 KC喝咖啡【二分答案/最大化平均值模板】
- 洛谷 P1068 分数线划定【结构体排序】
- sql developer 自定义快捷键
- Largest Divisible Subset -- LeetCode
- [BZOJ 3144] 切糕
- Scala高手实战****第19课:Scala的包、继承覆写及Spark源码鉴赏
- JavaScript跳转到页面某个锚点#
- SQL Server DBA 文章:116篇 --DBA_Huangzj
- javascript 定时器 笔记