第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

Jquery animate中的step方法問(wèn)題

Jquery animate中的step方法問(wèn)題

阿晨1998 2018-10-10 20:19:14
是這樣的。因?yàn)楸容^喜歡js,而且js數(shù)組也好操作,想用網(wǎng)頁(yè)寫(xiě)一個(gè)電梯模擬算法,用到了animate來(lái)表現(xiàn)動(dòng)畫(huà)效果。最開(kāi)始的時(shí)候我遇到了這樣的問(wèn)題。假設(shè)電梯從6樓下降到1樓,那么就要生成一個(gè)從6到1樓的勻速運(yùn)動(dòng)動(dòng)畫(huà),這個(gè)動(dòng)畫(huà)是一個(gè)線程。但是如果下降到了4樓的時(shí)候,突然3樓有人要上電梯,那就必須得在3樓停下來(lái)。如果在這個(gè)線程之后直接調(diào)用去3樓的線程,兩個(gè)線程不會(huì)互相覆蓋,而是會(huì)互相累加,它會(huì)先到1樓后上3樓,但如果在接收到3樓請(qǐng)求的時(shí)候立刻調(diào)用stop(true)方法停止動(dòng)畫(huà)并且重新生成一個(gè)動(dòng)畫(huà)的話,在停止的那里會(huì)卡頓一下,這樣看起來(lái)好像電梯故障,不是想要的效果。經(jīng)過(guò)一番查資料,我找到了step這個(gè)方法,先貼一下網(wǎng)上的資料代碼。借用,無(wú)意冒犯這個(gè)step方法相當(dāng)于把一個(gè)動(dòng)畫(huà)分解成無(wú)數(shù)小段,每執(zhí)行一個(gè)小段就會(huì)調(diào)用一遍。并且提供了修改fx.now和fx.end的值的機(jī)會(huì),我以為這就是我要的方法。只要接收到3樓請(qǐng)求的時(shí)候,修改fx.end為3樓的位置就行了。緊接著新的問(wèn)題就出來(lái)了。fx.now雖然也是fx的一個(gè)屬性,但這個(gè)屬性不是死的,經(jīng)過(guò)我查詢JQuery源碼,發(fā)現(xiàn)它是根據(jù)start、end以及移動(dòng)位置百分比來(lái)計(jì)算的,一旦修改了end,now值就會(huì)改變,造成電梯突然往上抽搐一下接著下降的效果。很抱歉啰嗦了這么多,只是為了把問(wèn)題說(shuō)得更清楚。有沒(méi)有dalao對(duì)這個(gè)方法比較熟悉,能不能幫忙想個(gè)解決辦法,或者做這個(gè)電梯小程序還有沒(méi)有別的表現(xiàn)方式?謝謝dalao
查看完整描述

1 回答

?
嗶嗶one

TA貢獻(xiàn)1854條經(jīng)驗(yàn) 獲得超8個(gè)贊

今天被迫查了JQuery,又經(jīng)過(guò)一番嘗試,終于找到了解決辦法。大概有我這種問(wèn)題的人很少吧,不過(guò)我還是貼一下答案吧。
雖然step提供了修改fx的屬性值的一個(gè)機(jī)會(huì),但是并不是直接修改就能解決的。在這里,fx.start和fx.end都是一成不變的,而fx.pos這個(gè)屬性,代表的是動(dòng)畫(huà)當(dāng)前狀態(tài)在整個(gè)動(dòng)畫(huà)過(guò)程中的百分比,它的值從0到1,中間是以0.為開(kāi)頭的一長(zhǎng)串小數(shù)。而fx.now代表的就是動(dòng)畫(huà)當(dāng)前屬性改變的值。
經(jīng)過(guò)一番查源碼,得到這樣一個(gè)公式:fx.now = (fx.end - fx.start) * fx.pos + fx.start。倘若修改了fx.end的話,now值有可能會(huì)改變,就會(huì)造成中途動(dòng)畫(huà)突然抽搐一下的情況。所以需要修改fx.start的值。假設(shè)修改后fx.end的值為end1,修改后fx.start,設(shè)其為start1,那么
start1 = (fx.start - fx.pos * (fx.start - (fx.end - end1)))/(1 - fx.pos)
并且start只能賦值一次,接下來(lái)的step方法需要沿用賦值后的start。也就是說(shuō),設(shè)一個(gè)初始變量

var flag = truestep:function(now,fx){
    fx.end = end1;//這一步用來(lái)修改fx.end的值,請(qǐng)根據(jù)自己需要去寫(xiě)。    if(flag){
        fx.start = (fx.start - fx.pos * (fx.start - (fx.end - end1)))/(1 - fx.pos);
        flag = false;
    }
}


查看完整回答
反對(duì) 回復(fù) 2018-11-13
  • 1 回答
  • 0 關(guān)注
  • 530 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)