motion-index-optimize
This commit is contained in:
parent
f3b9b43d9c
commit
8c25955889
|
|
@ -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>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user