鍍金池/ 問答/HTML5  HTML/ react如何實現(xiàn)點擊暫停/繼續(xù)動畫?

react如何實現(xiàn)點擊暫停/繼續(xù)動畫?

用css動起來很簡單，不知道在react怎么控制暫停和繼續(xù)，有沒有簡單些的方法，只用得到一個動畫而已。

回答
編輯回答
離夢

AnimationPlayState這個屬性很好用，但是ios上不兼容，哈，無語

            <div style={this.state.clickonthe ? {
                AnimationPlayState: 'running',
                WebkitAnimationPlayState: 'running',
            } : {
                    AnimationPlayState: 'paused',
                    WebkitAnimationPlayState: 'paused',

                }}>
            </div>
2018年1月21日 08:46
編輯回答
凝雅

在 jsx 中利用 state 控制 css

<div className={this.state.paused ? 'blocked-circle':'circle'}></div>

同時，在 css 中增加一個 blocked-circle 類

2017年11月17日 20:52
編輯回答
熟稔
<div class="circle" style={this.state.pause ? {animationPlayState:'paused'} : {}}>
2018年2月2日 19:05