JQuery实现隐藏和显示动画效果
本文为大家分享了JQuery实现隐藏和显示动画效果的具体代码，供大家参考，具体内容如下
隐藏和显示
语法
- $(selector).fadeIn([speed,callback]);
- $(selector).fadeOut([speed,callback]);
- $(selector).fadeToggle([speed,callback]);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值：“slow”、“fast” 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
实现代码
文档处理 - 锐客网 div {background: lightblue; padding: 20px; }p {background: lavenderblush; padding: 20px; } div1
div2p1
p2
效果展示
隐藏效果展示
文章图片
显示效果展示
文章图片
切换显示和隐藏
从P1切换成了P2
文章图片
淡入和淡出 语法
- $(selector).fadeIn([speed,callback]);
- $(selector).fadeOut([speed,callback]);
- $(selector).fadeToggle([speed,callback]);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值：“slow”、“fast” 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
实现代码
效果 - 锐客网 div {background: lightblue; padding: 20px; }p {background: lavenderblush; padding: 20px; } div1
div2p1
p2
效果与隐藏和显示相差不大
【JQuery实现隐藏和显示动画效果】以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
推荐阅读
- 关于QueryWrapper|关于QueryWrapper,实现MybatisPlus多表关联查询方式
- MybatisPlus使用queryWrapper如何实现复杂查询
- python学习之|python学习之 实现QQ自动发送消息
- 事件代理
- 孩子不是实现父母欲望的工具——林哈夫
- opencv|opencv C++模板匹配的简单实现
- Node.js中readline模块实现终端输入
- 如何在Mac中的文件选择框中打开系统隐藏文件夹
- java中如何实现重建二叉树
- 人脸识别|【人脸识别系列】| 实现自动化妆