深入學習jQuery動畫佇列

佇列實現是jquery非常棒的乙個拓展，使用動畫佇列可以使動畫更容易實現。本文將詳細介紹jquery動畫佇列

queue()方法用來顯示在匹配的元素上的已經執行的函式佇列

queue([queuename])

queue()方法可以接受乙個可選引數——乙個含有佇列名的字串。該引數預設是'fx'

<

script 
src=""
>
script
>
<
button 
id="btn"
>開始動畫
button
>
<
button 
id="reset"
>恢復
button
>
<
span 
id="result"
>
span
>
<
div 
id="box"
style
="position:relative;height: 100px;width: 300px;background-color: lightblue"
>
div>
<
script
>$('
#reset
').click(
function
())$(
'#btn
').click(
function
(event),
100)
$('#box
').animate(,
1000
).animate(,
1000
).animate(,
1000
).animate(,
1000
);});
script
>

queue(callback(next))

queue()方法可以接受乙個**函式作為引數，表示將要新增到佇列中的新函式

[注意]queue()方法的**函式中，可以進行樣式變換等，但不可以增加動畫效果

由下面**執行結果可以看出，佇列執行完函式後，佇列後面的動畫效果被停止，這時就需要用到下面要介紹的dequeue()方法

<

script 
src=""
>
script
>
<
button 
id="btn"
>開始動畫
button
>
<
button 
id="reset"
>恢復
button
>
<
span 
id="result"
>
span
>
<
div 
id="box"
style
="position:relative;height: 100px;width: 300px;background-color: lightblue"
>
div>
<
script
>$('
#reset
').click(
function
())$(
'#btn
').click(
function
(event),
100)
$('#box
').animate(,
1000
).animate(,
1000
); $(
'#box
').queue(
function
()) $(
'#box
').animate(,
1000
).animate(,
1000
);});
script
>

dequeue()方法用來執行匹配元素佇列的下乙個函式

dequeue([queuename])

dequeue()方法可以接受乙個可選引數——乙個含有佇列名的字串，預設是fx

[注意]dequeue()方法本身也算佇列的一員

<

script 
src=""
>
script
>
<
button 
id="btn"
>開始動畫
button
>
<
button 
id="reset"
>恢復
button
>
<
span 
id="result"
>
span
>
<
div 
id="box"
style
="position:relative;height: 100px;width: 300px;background-color: lightblue"
>
div>
<
script
>$('
#reset
').click(
function
())$(
'#btn
').click(
function
(event),
100)
$('#box
').animate(,
1000
).animate(,
1000
); $(
'#box
').queue(
function
()) $(
'#box
').animate(,
1000
).animate(,
1000
);});
script
>

與dequeue()方法相反，clearqueue()方法用來從列隊中移除所有未執行的項

[注意]clearqueue()並不影響當前動畫效果

clearqueue([queuename])

clearqueue()方法可以接受乙個可選引數——乙個含有佇列名的字串，預設是fx

<

script 
src=""
>
script
>
<
button 
id="btn"
>開始動畫
button
>
<
button 
id="btn1"
>停止動畫
button
>
<
button 
id="reset"
>恢復
button
>
<
span 
id="result"
>
span
>
<
div 
id="box"
style
="position:relative;height: 100px;width: 300px;background-color: lightblue"
>
div>
<
script
>$('
#reset
').click(
function
())$(
'#btn
').click(
function
(event),
100)
$('#box
').animate(,
1000
).animate(,
1000
); $(
'#box
').queue(
function
()) $(
'#box
').animate(,
1000
).animate(,
1000
);});$('
#btn1
').click(
function
(event))
script
>

深入學習Phaser補間動畫

tweens通常被稱為補間動畫。補間動畫是指在確定好兩個關鍵幀之後，由計算機自動生成這兩幀之間插補幀，從而實現動畫的過程。例如，物體從當前位置在兩秒內向右移動200個畫素，只要設定好目標位置 當前位置的右邊200畫素 和時長 兩秒 則計算機會自動生成補間動畫，在兩秒內使物體從當前位置移到目標位置。最...

UIApplication深入學習

新建乙個任意型別的ios應用工程，加入我們在class prefix輸入是tc，我們可以看到工程中生成乙個類 在main函式中，autoreleasepool 函式中 說明 當應用程式將要入非活動狀態執行，在此期間，應用程式不接收訊息或事件。比如來 了。說明 當應用程式入活動狀態執行，這個剛好跟上面...

深入學習CSS

什麼是css？在之前的這篇文章中已經介紹了初步的介紹，詳細請看 div加css進一步講解了css中的內容，先總結如下圖 其實在實際開發中，我們通常採用是外部樣式的匯入，這樣做的好處是對於很對有同樣設計樣式的頁面可以實現樣式的共享，這樣我們不僅僅可以節省了大量的時間，並且也方便我們可以靈活的呼叫的樣式...