vue 图标简单抖动晃动效果
<div class="fixed-box" ><img class="rotate" :class="[{'r1': shrinkPacket}, {'r2': !shrinkPacket}]" src="../../../assets/images/consume_packet.png"/></div>.fixed-box {position: fixed;
·
<div class="fixed-box" >
<img class="rotate" :class="[{'r1': shrinkPacket}, {'r2': !shrinkPacket}]" src="../../../assets/images/consume_packet.png"/>
</div>
.fixed-box {
position: fixed;
left: 5px;
bottom: 6rem;
width: 2rem;
height: 2.5rem;
img {
width: 2rem;
height: 2.5rem;
}
.r1 {
transform:rotate(-5deg);
}
.r2 {
transform:rotate(3deg);
}
}
startRotate() {
clearInterval(this.timer);
this.timer = setInterval(()=>{
this.shrinkPacket = !this.shrinkPacket
},150);
},
更多推荐
已为社区贡献25条内容
所有评论(0)