怎么用js触发css3动画

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了怎么用js触发css3动画相关的知识,希望对你有一定的参考价值。

参考技术A 你用CSS3的方式预先写好动画样式,不调用这个class,前端中设置鼠标经过增加一个class,这样鼠标指向的时候就有CSS3的动画,鼠标离开去除样式动画结束

CSS动画,由其他DIV动作触发

比如说,鼠标经过DIV1的时候,DIV2开始执行过渡动画,这个不用jS,JQ,纯CSS3动画能实现吗?

参考技术A 可以的,用:hover就可以了追问

div1:hove,然后呢,怎么让div2改变样式?

追答

.div1:hover .div2emmm;

追问

#div1
width: 100px;
height: 100px;
background-color: red;

#div2
width: 100px;
height: 100px;
background-color: blue;

.div1:hover.div2
background-color: yellow;

这样?不行啊,还是要写成.#div1:hover.#div2?好像也不行啊

本回答被提问者采纳
参考技术B .div1:hover空格.div2emmm;

以上是关于怎么用js触发css3动画的主要内容,如果未能解决你的问题,请参考以下文章

如何使用js捕获css3动画

CSS3动画如何设置滑动到当屏的时候才触发动画播放

vue.js 配合css3 动画

如何触发css3过渡动画

CSS3动画如何设置滑动到当屏的时候才触发动画播放

css3的-webkit-animation动画执行后会变回原来的样子,怎么保留住动画最后的状态呢?