使用CSS3 animation实现gif动图的暂停和播放实例页面

html:

使用angular加载元素

css:

使video播放实现旋转效果

@-webkit-keyframes changehovertree{0%{-webkit-transform:rotate(0)} 50%{-webkit-transform:rotate(180deg)} 100%{-webkit-transform:rotate(360deg)}}

@keyframes changehovertree{0%{transform:rotate(0)}  50%{transform:rotate(180deg)} 100%{transform:rotate(360deg)}}

.rotate{

    animation:changehovertree 4s linear infinite;

    -webkit-animation:changehovertree 4s linear infinite;

    -moz-animation: changehovertree 4s linear infinite;

}

js:

点击播放


你可能感兴趣的:(使用CSS3 animation实现gif动图的暂停和播放实例页面)