jQuery fadeIn()方法
jQuery 中的 fadeIn() 方法用于将选中元素的不透明度从隐藏更改为显示。
语法
语法如下 −
$(selector).fadeIn(speed,easing,callback)
示例
在上面,speed 是渐显效果的速度。easing 可以是 swing 或 linear,用于在不同的动画点进行速度控制。Callback 是该方法结束执行后执行的函数。
现在让我们看一个示例来实现 jQuery fadeIn() 方法 −
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".btnout").click(function(){ $("div").fadeOut(); }); $(".btnin").click(function(){ $("div").fadeIn(); }); }); </script> </head> <body> <h2>Java</h2> <div> <p>Java released in 1994. The current version is Java 13.</p> </div> <button class="btnout">Fade out</button> <button class="btnin">Fade in</button> <p>Click on above buttons to fade out and fade in text.</p> </body> </html>
输出
它将产生以下输出 −
单击上面的“Fade out”按钮淡出该文本 −
现在单击上面的“Fade in”按钮淡入(显示)该文本
广告