jquery中fadeIn()方法与fadeOut()方法(示例)

发布时间:2020-05-08编辑:脚本学堂
介绍下jquery中fadeIn()方法与fadeOut()方法的用法,分享一个小例子,用于理解与掌握fadeIn()方法与fadeOut()方法的应用。

本节内容:
fadeIn()方法与fadeOut()方法

fadeIn()方法和fadeOut()方法值改变元素的不透明度。
fadeOut()方法会在指定的一段事件内降低元素的不透明度,直到元素完全消失(“dispaly:none;”)。fadeIn()方法则相反。

如果只想改变“内容”的不透明度,而不想改变其高度和宽度,就可以使用fadeOut()方法。

代码:
 

复制代码 代码示例:
$(function() {
    $("#panel h5.head").toggle(function() {
        $(this).next().fadeOut();
    }, function() {
        $(this).next().fadeIn();
    });
});
 

当第一次单击“标题”链接后,“内容”慢慢地消失了,当再次单击“标题”链接后,“内容”又慢慢地显示了。