motion-index-optimize

This commit is contained in:
WindowBird 2025-10-27 11:36:51 +08:00
parent f3b9b43d9c
commit 8c25955889

View File

@ -21,33 +21,29 @@ const items = [
title="我们的优势" title="我们的优势"
/> />
</Motion> </Motion>
<Motion
:in-view-options="{ once: true }"
:initial="{ opacity: 0,scale:0 }"
:transition="{ duration: 0.6,delay: 0.1}"
:while-in-view="{ opacity: 1,scale:1 }"
>
<view class="flex items-center flex-col lg:px-80 sm:flex-row">
<view class="flex items-center flex-col lg:px-80 sm:flex-row">
<Motion
:in-view-options="{ once: true }"
:initial="{ opacity: 0,scale:0 }"
:transition="{ duration: 0.6,delay: 0.1}"
:while-in-view="{ opacity: 1,scale:1 }"
>
<div class="relative w-full max-w-5xl mx-auto aspect-video md:aspect-[16/9]"> <div class="relative w-full max-w-5xl mx-auto aspect-video md:aspect-[16/9]">
<UCarousel v-slot="{ item }" :items="items" arrows class="w-full max-w-xs mx-auto"> <UCarousel v-slot="{ item }" :items="items" arrows class="w-full max-w-xs mx-auto">
<nuxt-img :src="item" class="rounded-lg" height="320" width="320"/> <nuxt-img :src="item" class="rounded-lg" height="320" width="320"/>
</UCarousel> </UCarousel>
</div> </div>
</Motion>
<Motion
:in-view-options="{ once: true }"
:initial="{ opacity: 0,scale:0 }"
:transition="{ duration: 0.6,delay: 0.1}"
:while-in-view="{ opacity: 1,scale:1 }"
>
<div class="relative w-full max-w-6xl mx-auto aspect-video md:aspect-[16/9]"> <div class="relative w-full max-w-6xl mx-auto aspect-video md:aspect-[16/9]">
<img alt="" class="rounded-lg" src='/img/index/advantage.png'> <img alt="" class="rounded-lg" src='/img/index/advantage.png'>
</div> </div>
</Motion>
</view> </view>
</Motion>
</div> </div>
</template> </template>