优化元素动画选择面板体验

This commit is contained in:
pipipi-pikachu 2021-01-22 09:55:23 +08:00
parent d54a468378
commit 1f227e19ae

View File

@ -10,15 +10,20 @@
<div <div
class="pool-item" class="pool-item"
v-for="item in type.children" :key="item.name" v-for="item in type.children" :key="item.name"
:class="[ @mouseenter="hoverPreviewAnimation = item.value"
'animate__animated', @mouseleave="hoverPreviewAnimation = ''"
'animate__faster',
hoverPreviewAnimation === item.value && `animate__${item.value}`,
]"
@mouseover="hoverPreviewAnimation = item.value"
@click="addAnimation(item.value)" @click="addAnimation(item.value)"
> >
{{item.name}} <div
class="animation-box"
:class="[
'animate__animated',
'animate__faster',
hoverPreviewAnimation === item.value && `animate__${item.value}`,
]"
>
{{item.name}}
</div>
</div> </div>
</div> </div>
</div> </div>