jqury如何一次性實現連貫的一系列不同動作？
阿新 • • 發佈：2018-01-21
query 動作 開始 har slow gpo position posit ide
1.用animate();動畫隊列；
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ var div=$("div"); div.animate({height:‘300px‘,opacity:‘0.4‘},"slow");//動作1 div.animate({width:‘300px‘,opacity:‘0.8‘},"slow");//動作2 div.animate({height:‘100px‘,opacity:‘0.4‘},"slow");//動作3 div.animate({width:‘100px‘,opacity:‘0.8‘},"slow");//動作4 });//執行動作的先後順序按照從上往下的規律 }); </script> </head> <body> <button>開始動畫</button><p>默認情況下，所有的 HTML 元素有一個靜態的位置，且是不可移動的。 如果需要改變為，我們需要將元素的 position 屬性設置為 relative, fixed, 或 absolute!</p> <div style="background:#98bf21;height:100px;width:100px;position:absolute;"> </div>
</body>
</html>
2.用jquery中的鏈；
<!DOCTYPE html> <html> <head> <metacharset="utf-8"> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function() { $("button").click(function(){ $("#p1").css("color","red") .slideUp(2000) .slideDown(2000);//執行的順序按照點之前到點之後 }); }); </script> </head> <body> <p id="p1">菜鳥教程!!</p> <button>點我</button> </body> </html>
jqury如何一次性實現連貫的一系列不同動作？