課程
/前端開發(fā)
/HTML/CSS
/十天精通CSS3
前面不是說暫停了之后再重新開始元素從暫停位置開始繼續(xù)動畫,樣式回到最初狀態(tài)?老師,麻煩給個實例參考下吧,沒想通。。。。
2014-12-31
源自:十天精通CSS3 9-8
正在回答
你的問題可以這樣解決,
span{
? display: inline-block;
? width: 20px;
? height: 20px;
? background: orange;
? transform: translateY(90px);
? animation-name: move;
? animation-play-state:paused;
}
div:hover span {
? animation-duration: 10s;
? animation-timing-function: ease-in;
? animation-delay: .2s;
? animation-iteration-count:infinite;
? animation-direction:alternate;
?animation-play-state:running;
qq_慕蓋茨8361330
暫停有兩種方式,取不同的值效果不一樣,其中一種是暫停后,再播放時從停止狀態(tài)繼續(xù)開始,另外一個種是暫停后,再播放是從最初狀態(tài)開始。這個樣的示例,自己取值一試就明白。
雞仔煲綠豆沙
舉報
本課程為CSS3入門教程,深刻詳解CSS3知識讓網(wǎng)頁穿上絢麗裝備
2 回答如果暫停了動畫的播放,元素的樣式將回到最原始設(shè)置狀態(tài)
3 回答元素的樣式將回到最原始設(shè)置狀態(tài)。原始設(shè)置狀態(tài)是指?
5 回答動畫的最終結(jié)果是停留在100%的狀態(tài)還是最初定義的狀態(tài)呢?
2 回答對暫停狀態(tài)的疑惑
2 回答FF46、IE11,如果元素沒有設(shè)置border,動畫里的border屬性就無效,bug?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2018-08-21
你的問題可以這樣解決,
如果暫停了動畫的播放,元素的樣式將回到最原始設(shè)置狀態(tài)
span{
? display: inline-block;
? width: 20px;
? height: 20px;
? background: orange;
? transform: translateY(90px);
? animation-name: move;
? animation-play-state:paused;
}
div:hover span {
? animation-name: move;
? animation-duration: 10s;
? animation-timing-function: ease-in;
? animation-delay: .2s;
? animation-iteration-count:infinite;
? animation-direction:alternate;
?animation-play-state:running;
}
2015-01-04
暫停有兩種方式,取不同的值效果不一樣,其中一種是暫停后,再播放時從停止狀態(tài)繼續(xù)開始,另外一個種是暫停后,再播放是從最初狀態(tài)開始。這個樣的示例,自己取值一試就明白。