標籤：style blog http color io os ar java sp
1.測試代碼
<!doctype html><html><head lang=‘en‘><meta charset=‘utf-8‘></meta><style>#animater{ width: 150px; background:; border: 1px solid black; /*為了移動，需設定此屬性*/ position: relative; }</style></head><body><div id="animater"> stop()方法測試 </div> <div id="button"> <input type="button" id="button1" value="stop()"/> <input type="button" id="button2" value="stop(true)"/> <input type="button" id="button3" value="stop(false,true)"/> <input type="button" id="button4" value="stop(true,true)"/> </div><script type="text/javascript" src="jquery-2.1.1.min.js"></script><script>// 為了看效果，隨意寫的動畫 $(‘#animater‘).animate({ ‘right‘:-800 }, 3000).animate({‘font-size‘:‘16px‘},‘normal‘).animate({‘font-size‘:‘26px‘},‘normal‘).animate({‘font-size‘:‘36px‘},‘normal‘).animate({‘font-size‘:‘46px‘},‘normal‘).animate({‘font-size‘:‘56px‘},‘normal‘).animate({‘opacity‘:0},‘normal‘).animate({‘opacity‘:1},‘normal‘).animate({‘left‘:200,‘font-size‘:‘16px‘},‘normal‘); // 點擊不同的button執行不同的操作 $(‘#button1‘).click(function(){ //預設參數是false，不管寫一個false還是兩個false還是沒寫false效果一樣 $(‘#animater‘).stop(); }); $(‘#button2‘).click(function(){ //第二個參數預設false $(‘#animater‘).stop(true); }); $(‘#button3‘).click(function(){ $(‘#animater‘).stop(false,true); }); $(‘#button4‘).click(function(){ $(‘#animater‘).stop(true,true); });</script></body></html>
2.：試驗擊這四個按鈕測試，stop()在不同參數下的效能：
3.結果：
stop():的預設值是stop(false,false),第一個animate停止，接下來的其他animate都依次執行；
stop(true):第一個animate停止，接下來的其他animate都停止；
stop(false,true):第一個animate跳到最終結果，接下來的animate繼續依次執行，最後停止在第一個animate起跳之前的狀態；
stop(true,true):第一個animate跳到最終結果，接下來的其他animate都停止；
jquery---stop()
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
