如下图,当点击锤子或者木鱼的时候,实现敲击一下,使用css动画实现。代码如下:

解决方法就是给这个dom加一个key,并且这个key随机生成字符串就可以了。

 css代码:

.animation-tick{
    animation-name:'muyu-tick';
    animation-duration:0.10s;
    animation-timing-function: linear
}
@keyframes muyu-tick {
    0% {
        transform: rotate(40deg);
    }
    50% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(40deg);
    }
}

html代码 :

<image  @tap.stop.prevent="et_tick" :class="'stick '+dhclass" :src="pageinfo.picurl_stick" :key="dhkey"/>

js代码:

that.dhkey=lsktl.rndstr();
that.dhclass='animation-tick hehe'+lsktl.rndstr();

更多推荐