androidgallery廣告輪播,微信小程序圖片輪播組件galleryslider使用方法詳解

本文實例為大家分享了微信小程序圖片輪播組件的具體代碼&＃xff0c;供大家參考&＃xff0c;具體內容如下

先上效果圖&＃xff1a;

wxml

autoplay&＃61;"{{autoplay}}" interval&＃61;"{{interval}}" duration&＃61;"{{duration}}"

indicator-color&＃61;"#fff" indicator-active-color&＃61;"red">

wxss

.imgw{width:100%;}

js

/**

*頁面的初始數據

*/

data: {

banner_url: data.bannerList(),

open: false,

indicatorDots: true,//是否顯示面板指示點

autoplay: true,//是否開啟自動切換

interval: 3000,//自動切換時間間隔

duration: 500//滑動動畫時長

}

最終效果&＃xff1a;

總結&＃xff1a;

1. scroll-view組件的作用是可以觸發觸摸滑動

2. swiper組件的作用是制作圖片自動切換&＃xff0c;形成輪播

3. navigator組件的作用是給每個圖片添加鏈接

主要是scroll-view和swiper兩個組件制作成可滑動的輪播組件。愛掏網 - it200.com

以上就是本文的全部內容&＃xff0c;希望對大家的學習有所幫助&＃xff0c;也希望大家多多支持腳本之家。愛掏網 - it200.com