动画css上的冻结状态位置

Question

我想在hover上保存.pole-main .pole-gatherings .img:hover元素的图像位置。

冻结它与animationcss效果

当hover出来时，我想把它动画化回

如.pole-main .pole-gatherings .img:hover中所述

https://jsfiddle.net/kb2grhL5/

Answer 1

将动画从关键帧更改为过渡：

.pole-main .pole-gatherings .img{
width: 283px;
height: 102px;
background-color: blue;
transition: transform .7s;
transform-origin: 0% 0%;
transition-timing-function: ease-out;
}
.pole-main .pole-gatherings .img:hover{
transform: perspective(300px) rotateY(-5deg);
}