更改當前無限運行CSS動畫的百分比

我想創建一個非常自己的基本滑塊。滑動工作像一個魅力，是無限的，但我想讓用戶跳過/回到特定的鄰居（例如箭頭）。更改當前無限運行CSS動畫的百分比

@keyframes slider-ani { 
    0% { left: 33.3%; } 
    20% { left: 33.3%; } 
    25% { left: 0%; } 
    45% { left: 0%; } 
    50% { left: -33.3%; } 
    70% { left: -33.3%; } 
    100% { left: 33.3%; } 
}

有沒有辦法讓Javascript命令告訴正在運行的動畫進入下一步， 25％至45％。

我想盡可能多地使用CSS3。我知道這很容易在jQuery中完成。

JSFiddle

來源

2015-11-01 kwoxer

好吧，它不僅僅是這個。但無論如何，我添加了一個jsfiddle。 =） – kwoxer

我覺得用CSS和箭頭實現這一點很困難，但是在任何情況下，在點擊箭頭之後發生向前/向後跳轉之後是否需要繼續滑動？ – Harry

單擊一個箭頭即可進入下一個百分比值。那麼動畫應該繼續。 – kwoxer

得到它與CSS和單選按鈕的工作（沒有關鍵幀）。這非常棒，因爲它在沒有jQuery的情況下運行，並且在任何設備上運行。但創建它很難。

來源

2015-11-28 07:47:16 kwoxer

更改當前無限運行CSS動畫的百分比

回答

相關問題