css3 animation 如何让他停在最后

发布网友发布时间：2022-04-22 08:14

共3个回答

热心网友时间：2022-05-08 06:51

animation-fill-mode : forwards //设置对象状态为动画结束时的状态 animation-fill-mode 语法：animation-fill-mode：none | forwards | backwards | both [ , none | forwards | backwards | both ]*默认值：none适用于：所有元素，包含伪对象:after和:before继承性：无取值：none：默认值。不设置对象动画之外的状态forwards：设置对象状态为动画结束时的状态backwards：设置对象状态为动画开始时的状态both：设置对象状态为动画结束或开始的状态说明：检索或设置对象动画时间之外的状态如果提供多个属性值，以逗号进行分隔。对应的脚本特性为animationFillMode。这个是最简单的方法，也可以侦听动画结束事件，给元素加个class类名，这个class定义的就是元素结束时的状态的css样式

热心网友时间：2022-05-08 08:09

在这里面添加试试~
div.menu:hover{
-webkit-animation:showmenu 0.5s 1;

-webkit-animation-fill-mode:forwards;

}

热心网友时间：2022-05-08 09:44

你可以看一下，animation-fill-mode的参数，其中forwards和both都可以停在最后
例子：
animation-fill-mode：forwards；