課程
/前端開發(fā)
/JavaScript
/H5+JS+CSS3 實(shí)現(xiàn)圣誕情緣
能不能在一次點(diǎn)擊下實(shí)現(xiàn)來回飛呢
2015-12-19
源自:H5+JS+CSS3 實(shí)現(xiàn)圣誕情緣 3-4
正在回答
先定義一個(gè)類名,加上css3動(dòng)畫animation,animation里弄個(gè)來回飛的動(dòng)畫就行了,然后用js給點(diǎn)擊元素加上這個(gè)定義好的類名就會(huì)出現(xiàn)你要的效果了,在動(dòng)畫結(jié)束的時(shí)候,你可以使用animationEnd事件(這個(gè)需要封裝成一個(gè)兼容的函數(shù)好點(diǎn),可以參考bootstrap對(duì)transitionEnd事件的封裝),來移除剛加上去的類名,下次點(diǎn)擊再加上,就可以循環(huán)有來回飛的效果了。
舉報(bào)
為圣誕節(jié)準(zhǔn)備的H5+JS+CSS特效案例教程,實(shí)現(xiàn)靜與動(dòng)的結(jié)合
5 回答咋沒有飛過來呢
3 回答實(shí)現(xiàn)起來很復(fù)雜吧
1 回答鳥飛不走啊
3 回答鳥不飛的解決辦法
2 回答旋轉(zhuǎn)木馬實(shí)現(xiàn)
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2015-12-19
先定義一個(gè)類名,加上css3動(dòng)畫animation,animation里弄個(gè)來回飛的動(dòng)畫就行了,然后用js給點(diǎn)擊元素加上這個(gè)定義好的類名就會(huì)出現(xiàn)你要的效果了,在動(dòng)畫結(jié)束的時(shí)候,你可以使用animationEnd事件(這個(gè)需要封裝成一個(gè)兼容的函數(shù)好點(diǎn),可以參考bootstrap對(duì)transitionEnd事件的封裝),來移除剛加上去的類名,下次點(diǎn)擊再加上,就可以循環(huán)有來回飛的效果了。