【jQuery】使用fadeIn()与fadeOut()方法实现淡入淡出效果

fadeIn()fadeOut()方法可以实现元素的淡入淡出效果,前者淡入隐藏的元素,后者可以淡出可见的元素,它们的调用格式分别为:

$(selector).fadeIn(speed,[callback])$(selector).fadeOut(speed,[callback])

其中参数speed为淡入淡出的速度,callback参数为完成后执行的回调函数名。

例如,分别在页面中以淡入淡出的动画效果显示图片元素,如下图所示:

【jQuery】使用fadeIn()与fadeOut()方法实现淡入淡出效果_第1张图片

在浏览器中显示的效果:

【jQuery】使用fadeIn()与fadeOut()方法实现淡入淡出效果_第2张图片

从图中可以看出,当点击“淡出”按钮时,调用fadeOut()方法以淡出效果隐藏图片,当点击“淡入”按钮时,调用fadeIn()方法以淡入效果显示图片。

你可能感兴趣的:(【jQuery】使用fadeIn()与fadeOut()方法实现淡入淡出效果)