資訊專欄INFORMATION COLUMN
摘要：的動畫系統(tǒng)就是執(zhí)行一個函數(shù)隊列。對元素應(yīng)用等動畫，都會默認(rèn)將函數(shù)壓入一個的隊列。動畫隊列向隊列中添加一個隊列函數(shù)，或者替換掉當(dāng)前隊列。注意不一定是動畫隊列的最后一個動畫終態(tài)。還提供了指令來立即完成整個動畫隊列。
動畫隊列
隊列的作用就是讓我們把一個又一個的任務(wù)放到一起，確保只有當(dāng)前面的任務(wù)完成了，才會開始下一個任務(wù)。這里面的任務(wù)可以是同步的，也可以是異步的。
jQuery的動畫系統(tǒng)就是執(zhí)行一個函數(shù)隊列。對jQuery元素應(yīng)用fade,slide,animate等動畫，都會默認(rèn)將函數(shù)壓入一個fx的隊列。在我們使用jq的animate()的時候，我們可以在option參數(shù)中傳入一個queue的標(biāo)志位來決定這個動畫時候壓入當(dāng)前元素的動畫隊列。如果為false,則不等待當(dāng)前隊列完成，而是立即執(zhí)行該動畫。
$element.queue(fun(next)) 讓我們向隊列中插入一個函數(shù)，當(dāng)我們向一個空隊列或者插入函數(shù)的時候，該函數(shù)會立即執(zhí)行。否則將排到隊尾執(zhí)行。插入的這個函數(shù)fun可以執(zhí)行一個同步或者異步的任務(wù)，但是不論是同步還是異步任務(wù)，如果我們想讓排在fun后面的隊列函數(shù)能夠執(zhí)行，都不要忘了在同步/異步任務(wù)完成之后使用next()。這個next 是jQuery的隊列系統(tǒng)在調(diào)用fun的時候傳入的，它是一個函數(shù)，執(zhí)行它就可以讓隊列繼續(xù)執(zhí)行。
jQuery動畫隊列Api.queue(): 向隊列中添加一個隊列函數(shù)，或者替換掉當(dāng)前隊列。速查
.dequeue(): 當(dāng)我們替換了一個新隊列之后，或者使用.stop 停止一個隊列之后，我們需要這個函數(shù)來重新啟動隊列。速查
.stop(): 停止當(dāng)前隊列中正在進行的任務(wù)。它還接收一個 jumptoend的參數(shù),如果傳入true,則直接跳到當(dāng)前動畫的終態(tài)。注意不一定是動畫隊列的最后一個動畫終態(tài)。速查
.delay()：設(shè)置一個延時來讓隊列延遲執(zhí)行。
以前比較老的版本的jQuery的動畫是使用定時器來完成的，新版本的jQuery增加了一項判斷，如果瀏覽器支持window.requestAnimationFrame,則會使用window.requestAnimationFrame.
jQuery 的動畫性能在移動端表現(xiàn)不佳，因為定時器或者其他的問題。velocity是一款性能更好的動畫庫。官方文檔的介紹也多次強調(diào)它的快，甚至要超過css3 transition了。它的api設(shè)計和jQuery.animate差不多一樣，其中動畫隊列的用法也和jQuery.queue一樣。它可以和jQuery一起使用。當(dāng)不引用jQuery時，Velocity時掛載在window對象中的，當(dāng)引用jQuery的時候，就掛載在jQuery對象下。只需在原先使用$.aniamte()的地方替換成$.velocity()，就切換到了velocity動畫庫。
velocity 兼容velocity.js v2.0版本 官方目前支持IE11, Edge, Chrome, Safari, and Firefox。（我自己用的時候，V2.0在IE11，edge會報錯。）。所以一般用V1.5。(兼容性好了，性能就要犧牲一點。)而且在如果要支持到IE8,就必須引入jQuery1.X版本。
velocity 特性它支持屬性值函數(shù)，顏色動畫，CSS3的transform,scroll(頁面或者元素的滾動),svg,可以配合velocity.ui.js 注冊動畫集合，管理多個元素應(yīng)用同一動畫時的間隔，velocity.ui.js還內(nèi)置了多種動畫特效，方便選擇。
velocity.js還提供了Velocity("finish")指令來立即完成整個動畫隊列。
velocity.js中文官網(wǎng)
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/107298.html
摘要：微信公眾號后端進階，專注后端技術(shù)分享框架分布式中間件服務(wù)治理等等。 微信公眾號「后端進階」，專注后端技術(shù)分享：Java、Golang、WEB框架、分布式中間件、服務(wù)治理等等。 前段時間有個朋友向我提了一個問題，他說在搭建 RocketMQ 集群過程中遇到了關(guān)于消費訂閱的問題，具體問題如下： showImg(https://segmentfault.com/img/remote/1460...
摘要：總結(jié)以上這些在日常使用的時候如果不了解，很少會去用到，但如果想寫出優(yōu)雅，簡潔的代碼，這些概念會起到一定的幫助作用參考 collections 數(shù)據(jù)類型 collections 數(shù)據(jù)類型主要是為了彌補 list /tuple / dict 的額外數(shù)據(jù)類型 ChainMap 代碼： import collections ## 賦值，合并字典的作用 a = {a:A} b = {b:B} ...
摘要：等待一段時間是否有線程喚醒鎖，如果沒有，超時自動喚醒。隨機喚醒等待隊列中的等待同一個鎖的一個線程，使這個線程退出等待隊列，進入可運行狀態(tài)。條件隊列中是處于等待狀態(tài)的線程，等待特定條件為真。在一般情況下，總應(yīng)該調(diào)用喚醒所有需要被喚醒的線程。 方法 java.lang.Object public final native void wait() throws InterruptedExce...
閱讀 1458·2021-11-24 09:39
閱讀 1774·2021-11-22 15:25
閱讀 3728·2021-11-19 09:40
閱讀 3283·2021-09-22 15:31
閱讀 1288·2021-07-29 13:49
閱讀 1192·2019-08-26 11:59
閱讀 1308·2019-08-26 11:39
閱讀 919·2019-08-26 11:00
