1.html:
2.css代码:
.kuang {
height: 500px;
width: 400px;
// background-color: #fff;
position: absolute;
z-index: 10;
bottom: 0;
transform: translateX(-390px)
}
.kuang:hover {
animation: myanimation 3s linear 1;
animation-fill-mode:forwards;
background-color: #fff;
}
@keyframes myanimation {
0%{
transform: translateX(-400px);
}
100%{
transform:translateX(0);
}
}
3.实现效果: