jQuery 效果

2023-08-24 12:10| 来源: 网络整理| 查看: 265

w3school 在线教程 HTML 系列教程浏览器脚本服务器脚本编程教程 XML 系列教程建站手册参考手册 jQuery 教程 jQuery 教程 jQuery 简介 jQuery 安装 jQuery 语法 jQuery 选择器 jQuery 事件 jQuery 效果 jQuery 隐藏/显示 jQuery 淡入淡出 jQuery 滑动 jQuery 动画 jQuery stop() jQuery Callback jQuery Chaining jQuery HTML jQuery 获取 jQuery 设置 jQuery 添加 jQuery 删除 jQuery CSS 类 jQuery css() jQuery 尺寸 jQuery 遍历 jQuery 遍历 jQuery 祖先 jQuery 后代 jQuery 同胞 jQuery 过滤 jQuery AJAX jQuery AJAX 简介 jQuery 加载 jQuery Get/Post jQuery 杂项 jQuery noConflict() jQuery 实例 jQuery 实例 jQuery 测验 jQuery 参考手册 jQuery 参考手册 jQuery 选择器 jQuery 事件 jQuery 效果 jQuery 文档操作 jQuery 属性操作 jQuery CSS 操作 jQuery Ajax jQuery 遍历 jQuery 数据 jQuery DOM 元素 jQuery 核心 jQuery 属性建站手册网站构建万维网联盟 (W3C) 浏览器信息网站品质语义网职业规划网站主机关于 W3School 帮助 W3School jQuery 效果 - 淡入淡出 jQuery 隐藏/显示 jQuery 滑动

通过 jQuery，您可以实现元素的淡入淡出效果。

效果演示

点击这里，隐藏/显示面板

一寸光阴一寸金，因此，我们为您提供快捷易懂的学习内容。

在这里，您可以通过一种易懂的便利的模式获得您需要的任何知识。

实例 jQuery fadeIn() 演示 jQuery fadeIn() 方法。 jQuery fadeOut() 演示 jQuery fadeOut() 方法。 jQuery fadeToggle() 演示 jQuery fadeToggle() 方法。 jQuery fadeTo() 演示 jQuery fadeTo() 方法。 jQuery Fading 方法

通过 jQuery，您可以实现元素的淡入淡出效果。

jQuery 拥有下面四种 fade 方法：

fadeIn() fadeOut() fadeToggle() fadeTo() jQuery fadeIn() 方法

jQuery fadeIn() 用于淡入已隐藏的元素。

语法： $(selector).fadeIn(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

下面的例子演示了带有不同参数的 fadeIn() 方法：

实例 $("button").click(function(){ $("#div1").fadeIn(); $("#div2").fadeIn("slow"); $("#div3").fadeIn(3000); });

亲自试一试

jQuery fadeOut() 方法

jQuery fadeOut() 方法用于淡出可见元素。

语法： $(selector).fadeOut(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

下面的例子演示了带有不同参数的 fadeOut() 方法：

实例 $("button").click(function(){ $("#div1").fadeOut(); $("#div2").fadeOut("slow"); $("#div3").fadeOut(3000); });

亲自试一试

jQuery fadeToggle() 方法

jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。

如果元素已淡出，则 fadeToggle() 会向元素添加淡入效果。

如果元素已淡入，则 fadeToggle() 会向元素添加淡出效果。

语法： $(selector).fadeToggle(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

下面的例子演示了带有不同参数的 fadeToggle() 方法：

实例 $("button").click(function(){ $("#div1").fadeToggle(); $("#div2").fadeToggle("slow"); $("#div3").fadeToggle(3000); });

亲自试一试

jQuery fadeTo() 方法

jQuery fadeTo() 方法允许渐变为给定的不透明度（值介于 0 与 1 之间）。

语法： $(selector).fadeTo(speed,opacity,callback);

必需的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

fadeTo() 方法中必需的 opacity 参数将淡入淡出效果设置为给定的不透明度（值介于 0 与 1 之间）。

可选的 callback 参数是该函数完成后所执行的函数名称。

下面的例子演示了带有不同参数的 fadeTo() 方法：

实例 $("button").click(function(){ $("#div1").fadeTo("slow",0.15); $("#div2").fadeTo("slow",0.4); $("#div3").fadeTo("slow",0.7); });

亲自试一试

jQuery 效果参考手册

如需全面查阅 jQuery 效果，请访问我们的 jQuery 效果参考手册。

jQuery 隐藏/显示 jQuery 滑动 jQuery 参考手册 jQuery 测验

使用条款隐私条款技术支持：赢科蒙ICP备06004630号

【本文地址】

jQuery 效果

jQuery 效果

今日新闻

推荐新闻