首頁(yè) 猿問(wèn) 在輪播圖用transition時(shí)出...

在輪播圖用transition時(shí)出現(xiàn)的問(wèn)題

CSS3 JavaScript JQuery

我們 2016-08-23 12:40:40

/*為什么加了過(guò)渡offset值就會(huì)出現(xiàn)偏差？？？*//*transition: all 1s;*/我在做輪播圖的時(shí)候，給了輪播圖那個(gè)大盒子一個(gè)transition屬性，詭異的事情就來(lái)了，當(dāng)它點(diǎn)擊了數(shù)次之后，數(shù)值就會(huì)出現(xiàn)偏差，比如，我原來(lái)每一張圖片的大小就600px，那點(diǎn)擊一次切換一張，向右點(diǎn)擊的時(shí)候，第一張是0，第二張自然就是600了，可是加了transition過(guò)渡之后，點(diǎn)擊第二張的時(shí)候，居然變成了594px，而且每次點(diǎn)擊不一定就是那一張出問(wèn)題，改變的大小也不相同，請(qǐng)問(wèn)這是什么原因？是transition自身所帶的bug嗎？

查看完整描述

4 回答

阿旭_

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

沒(méi)代碼沒(méi)真相

1 反對(duì) 回復(fù) 2016-08-23

我們
代碼我貼出來(lái)了，請(qǐng)幫忙看看，感激不盡~~~~~·

回復(fù) 2016-08-23

阿旭_

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

我想的辦法就是不讓它可以點(diǎn)擊數(shù)次（同一個(gè)按鈕在一秒內(nèi)只能點(diǎn)擊一次，其它次失效）

你這個(gè)是自己寫的不是用的第三方的，我只能想到這個(gè)辦法了哈。要修改的代碼如下：

???????????var?rightTime?=?new?Date().getTime();//每個(gè)按鈕點(diǎn)擊的時(shí)間1秒內(nèi)不可再點(diǎn)擊
???????????var?leftTime?=?new?Date().getTime();
???????????oNext.onclick?=?function?()?{
???????????????if(new?Date().getTime()?-?rightTime?<?1000){
???????????????????return;
???????????????}
???????????????rightTime?=?new?Date().getTime();
???????????????index?=?(index?==?5???1?:?++index);
???????????????animate(-600);
???????????};
???????????oPrev.onclick?=?function?()?{
???????????????if(new?Date().getTime()?-?leftTime?<?1000){
???????????????????return;
???????????????}
???????????????leftTime?=?new?Date().getTime();
???????????????index?=?(index?==?1???5?:?--index);
???????????????animate(600);
???????????};

反對(duì) 回復(fù) 2016-08-23