JS 怎么动态设置CSS3动画的样式

JavaScript010

JS 怎么动态设置CSS3动画的样式,第1张

像这种效果,你要想知道,

已经下载下来,你拆开看一下就知道了。

说说原理,这里并不是纯css3,,只是用css3定义好动画,

@-moz-keyframes tips {

0% {box-shadow: 0px 0px 0px #f00}

25% {box-shadow: 0px 0px 8px #f00}

50% {box-shadow: 0px 0px 0px #f00}

100% {box-shadow: 0px 0px 8px #f00}

}

然后,js在切屏后,用Js来触发这一个样式,这个样式调用了刚才定义的动画。

.tips {

-webkit-animation:tips 1s

-moz-animation:tips 1s

}

当然css3是可以做的,只是用纯css3,就没办法像这样可以拖动切屏,这个是需要js或者jq来完成。。。

~如果你认可我的回答,请及时点击【采纳为满意回答】按钮

~~手机提问的朋友在客户端右上角评价点【满意】即可。

~你的采纳是我前进的动力

~~O(∩_∩)O,记得好评和采纳,互相帮助,谢谢。

可以结合css3实现。

css3可以设置动画和过渡,动画当中可以设置旋转、移动和缩放等参数。

可以在长按的时候,更改为带有动画的类名,就可以执行css3的动画了。