本文重点解决jQuey效果之滑动问题,希望能够帮助到你
jQuery 滑动方法有三种:slideDown()、slideUp()、slideToggle()。
jQuery slideDown() 方法用于向下滑动元素,
语法:$(selector).slideDown(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是滑动完成后所执行的函数名称。
例子:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>jQuery slideDown() 方法</title> 6 <style> 7 #div1{margin:0 auto; 8 width:300px; 9 height:30px; 10 background:orange; 11 text-align: center; 12 line-height:30px; 13 cursor:pointer; 14 } 15 #div2{margin:0 auto; 16 width:300px; 17 height:200px; 18 background:#BCEA5F; 19 text-align: center; 20 line-height:200px; 21 display: none; 22 } 23 </style> 24 <!-- jquery自己引入就好,我这里的是jquery-1.12.0.min.js --> 25 <script type="text/javascript" src="jquery-1.12.0.min.js"></script> 26 <script type="text/javascript"> 27 $(document).ready(function(){ 28 $("#div1").click(function(){ 29 $("#div2").slideDown(1000); 30 }); 31 }); 32 </script> 33 </head> 34 <body> 35 <div id="div1">点我下滑</div> 36 <div id="div2">这是内容</div> 37 </body> 38 </html>
本网刊登的文章均仅代表作者个人观点,并不代表本网立场。文中的论述和观点,敬请读者注意判断。