标签:anim src 属性 jquer document code style opened this
给<p></p>添加点击事件,如果点击$(this).hide()
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script type="text/javascript" src="jquery-3.2.1.min.js"> 5 </script> 6 <script type="text/javascript"> 7 $(document).ready(function(){ 8 $("p").click( 9 function(){ 10 $(this).hide(); 11 }); 12 }); 13 </script> 14 </head> 15 16 <body> 17 <p>点击会消失</p> 18 <p>点击会消失</p> 19 </body> 20 </html>
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
$(selector).hide(speed,callback); $(selector).show(speed,callback);
通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
显示被隐藏的元素,并隐藏已显示的元素:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script type="text/javascript" src="jquery-3.2.1.min.js"> 5 </script> 6 <script type="text/javascript"> 7 $(document).ready(function(){ 8 $("button").click(function(){ 9 $("p").toggle(); 10 }); 11 }); 12 </script> 13 </head> 14 15 <body> 16 <p>点击会消失</p> 17 <p>点击会消失</p> 18 <button type="button">切换</button> 19 </body> 20 </html>
jQuery fadeIn() 用于淡入已隐藏的元素。
jQuery fadeOut() 方法用于淡出可见元素。
jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
如果元素已淡出,则 fadeToggle() 会向元素添加淡入效果。
如果元素已淡入,则 fadeToggle() 会向元素添加淡出效果。
jQuery fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("#div1").fadeIn(); $("#div2").fadeIn(4000); $("#div3").fadeIn("slow"); }); }); </script> </head> <body> <p>演示带有不同参数的 fadeIn() 方法。</p> <button>点击这里,使三个矩形淡入</button> <br><br> <div id="div1" style="width:80px;height:80px;display:none;background-color:red;"></div> <br> <div id="div2" style="width:80px;height:80px;display:none;background-color:green;"></div> <br> <div id="div3" style="width:80px;height:80px;display:none;background-color:blue;"></div> </body> </html>
通过 jQuery,您可以在元素上创建滑动效果。
jQuery 拥有以下滑动方法:
jQuery animate() 方法用于创建自定义动画。
$(selector).animate({params},speed,callback);
必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称。
标签:anim src 属性 jquer document code style opened this
原文地址:http://www.cnblogs.com/abstract-fabulous/p/7197090.html