獲取@keyframe動畫元素的位置

@keyframes myAnim { 
    0% { 
     bottom: 47.5%; 
     left: 29%; 
    } 
    70% { 
     bottom: 70%; 
     left: 64%; 
    } 
    100% { 
     bottom: 0%; 
     left: 64%; 
    } 
}

帶有底部和左側百分比值的動畫可能與我們想要的位置不一樣。所以使用螢火蟲，在運行動畫時不可能檢查。所以，我試圖通過使用暫停方法檢查，但似乎是錯誤的：獲取@keyframe動畫元素的位置

@keyframes myAnim { 
    0% { 
     bottom: 47.5%; 
     left: 29%; 
    } 
    70% { 
     bottom: 70%; 
     left: 64%; 
     animation-play-state: paused; 
    } 
    /* so that I can inspect and set the percentage*/ 
    100% { 
     bottom: 0%; 
     left: 64%; 
    } 
}

有沒有什麼技術可以檢查運行動畫的值？

來源

2014-03-13 Bhojendra Nepal

設置動畫到

@keyframes myAnim{ 
    0%{bottom: 47.5%; left: 29%;} 
    100%{bottom: 70%; left: 64%;} 
    /* 
    100%{bottom: 0%; left: 64%;} 
    */ 
}

，並在元素設置向前爲動畫填充模式屬性。

這樣的動畫將在70％的關鍵幀

來源

2014-03-13 08:50:27 vals

我試過，但不停止.... –

對不起，我錯了的狀態結束。看起來您需要將最後一個關鍵幀設置爲100％。我認爲最後一個關鍵幀值會延伸到動畫結束。 – vals

獲取@keyframe動畫元素的位置

回答

相關問題