微信小程序中的swiper組件詳解
更新時間：2017年04月14日 11:05:56 作者：HaiJing1995
這篇文章主要介紹了微信小程序中的swiper組件詳解的相關資料,需要的朋友可以參考下
微信小程序中的swiper組件
微信小程序中的swiper組件真的是簡單方便
提供了頁面中圖片文字等滑動的效果
<swiper> <swiper-item></swiper-item> <swiper-item></swiper-item> <swiper-item></swiper-item> </swiper>
這里的就是一個滑塊視圖容器；而就是你希望滑動的東西，可以是文字也可以是image
其中swiper有很多屬性。常用的有
- 屬性名 默認值 作用
- indicator-dots false 是否顯示面板指示點
- indicator-color rgba(0, 0, 0, .3) 指示點的顏色
- indicator-active-color #000000 當前選中的指示點顏色
- autoplay false 是否自動播放
- intervaly 5000 自動切換時間間隔
更多的屬性可以去查看微信小程序官方教程
https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html
這里vertical=”true”在官方文檔中沒有提到，定義這個可以上下滑動
還有一點需要注意vertical=”false”時，仍然是上下滑動，原因就是微信小程序在解析時將”false”看成字符串，只要字符串不為空，就為真。所以我們需要這樣寫：vertical=”{{false}}”
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關文章
這篇文章主要為大家介紹了前端利用jsencrypt.js進行RSA加密示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-08-08
這篇文章主要介紹了JavaScript中的宏任務和微任務，下面文章圍繞JavaScript宏任務和微任務相關資料展開詳細內(nèi)容,需要的朋友可以參考一下，希望對大家有所幫助2021-11-11
這篇文章主要為大家介紹了詳解無界微前端是如何渲染子應用demo解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-04-04
這篇文章主要介紹了微信小程序 本地數(shù)據(jù)讀取實例的相關資料,需要的朋友可以參考下2017-04-04
這篇文章主要為大家介紹了前端使用koa實現(xiàn)大文件分片上傳示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
這篇文章主要介紹了微信小程序 實戰(zhàn)小程序實例的相關資料,需要的朋友可以參考下2016-10-10
JavaScript前端迭代器Iterator與生成器Generator講解
這篇文章主要為大家介紹了JavaScript前端迭代器Iterator與生成器Generator講解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
JS、HTML代碼運行工具...2006-06-06
這篇文章主要介紹了微信小程序 Image API實例詳解的相關資料,需要的朋友可以參考下2016-09-09
這篇文章主要介紹了JavaScript數(shù)組 幾個常用方法，主要概述的方法有filter()、map()、sort()、reduce()、forEach()，這些方法都是JavaScript常用到的方法，下面文章內(nèi)容詳細介紹了他們的語法、參數(shù)、返回值等資料,需要的朋友可以參考一下2021-11-11