您好,登錄后才能下訂單哦!
CSS3的animation直接提供一個 animation-play-state 屬性規定動畫正在運行還是暫停 。寫動畫樣式的時候特別注意下不同瀏覽器的兼容性,加上對應的前綴 :
div{ animation-play-state:paused; -webkit-animation-play-state:paused; /* Safari 和 Chrome */ }
只需要在對應的有animation元素節點上,通過動態增加刪除這個樣式就可以控制動畫的開始與暫停了,非常簡單 。
animation-play-state: paused|running;
paused 規定動畫已暫停;running 規定動畫正在播放。
前端學習秋秋qun: 767273102 。有任何不明白的東西隨時來問我
Internet Explorer 10、Firefox 以及 Opera 支持 animation-play-state 屬性。Safari 和 Chrome 支持替代的 -webkit-animation-play-state 屬性。
注意:
iOS 8-9 Safari,ios11的系統,微信里瀏覽器不行,動畫開始就不能暫停。
解決方法使用** -webkit-animation: none!important; 而不是 -webkit-animation-play-state:paused; **
.no-animation { -webkit-animation:none!important; }
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。