jQuery animate()小結
阿新 • • 發佈：2019-01-21
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $("div").animate({ left:'250px', opacity:'0.5', height:'150px', width:'150px'},5000,"linear"); //{left:'250px'}動畫效果 往右邊移動250PX；可以有多個 //5000動畫時間 以毫秒為單位 也可以是 slow 使用字串時需要加雙引號 //linear動畫效果 這個一般不寫 現在是開始和結束比較慢 中間快 $("div").animate({left:'0px'},"slow"); }); }); </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>