ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-18 09:24:25 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity
Files
a991aea5817ae72941d820eda77b2ad4ea820916
vant/docs/examples-docs/swipe.md
cookfront a991aea581 fix docs
2017-03-24 22:02:38 +08:00

1.1 KiB
Raw Blame History

<style> @component-namespace demo { @b swipe { .zan-swipe { height: 200px; img { width: 100%; } } } } </style>

Swipe 轮播

基础用法

:::demo 基础用法

<zan-swipe>
  <zan-swipe-item>
    <img src="https://img.yzcdn.cn/upload_files/2017/03/14/FmTPs0SeyQaAOSK1rRe1sL8RcwSY.jpeg?imageView2/2/w/980/h/980/q/75/format/webp" alt="">
  </zan-swipe-item>
  <zan-swipe-item>
    <img src="https://img.yzcdn.cn/upload_files/2017/03/15/FvexrWlG_WxtCE9Omo5l27n_mAG_.jpeg?imageView2/2/w/980/h/980/q/75/format/webp" alt="">
  </zan-swipe-item>
</zan-swipe>

:::

自动轮播

:::demo 自动轮播

<zan-swipe :auto-play="true">
  <zan-swipe-item>
    <img src="https://img.yzcdn.cn/upload_files/2017/03/14/FmTPs0SeyQaAOSK1rRe1sL8RcwSY.jpeg?imageView2/2/w/980/h/980/q/75/format/webp" alt="">
  </zan-swipe-item>
  <zan-swipe-item>
    <img src="https://img.yzcdn.cn/upload_files/2017/03/15/FvexrWlG_WxtCE9Omo5l27n_mAG_.jpeg?imageView2/2/w/980/h/980/q/75/format/webp" alt="">
  </zan-swipe-item>
</zan-swipe>

:::