<div class="cardty" >
<div class="activit identifier">
<div class="activit-ew"
:style="pageImg.happyActivit">
</div>
</div>
</div>
**css样式**
.cardty{
-webkit-perspective:500;
perspective:500; // 在这里添加
.activit {
width: 129px;
height: 174px;
// z-index: 25;
}
}
.identifier {
animation-name: identifier; /* 指定使用的关键帧名称 */
animation-duration: 0.7s; /* 设置动画持续时间为2秒 */
animation-iteration-count: 1; /* 无限次重复执行动画 */
animation-fill-mode: forwards;
animation-timing-function:cubic-bezier(
0.2,
0.02,
0.9,
0.99
); /* 线性变化速度函数 */
}
@keyframes identifier{
0% {
transform:rotateY(-55deg) translateY(700px);
-webkit-transform: rotateY(-55deg) translateY(700px);
scale: (1.1);
// transform: ;
}
92%{
transform: translateY(250px) rotate(0deg);
-webkit-transform: translateY(250px) rotateY(0deg) ;
scale: (1.01);
}
100% {
transform: translateY(150px) rotate(0deg);
-webkit-transform: translateY(150px) rotateY(0deg);
scale: (1);
}
}
07-01
1046

07-25
1401

04-26
2713
