网站建设资讯

NEWS

网站建设资讯

图片轮播组件galleryslider怎么用

这篇文章给大家分享的是有关图片轮播组件gallery slider怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

创新互联公司是一家专注于做网站、成都网站制作与策划设计,高明网站建设哪家好?创新互联公司做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:高明等地区。高明做网站价格咨询:13518219792

先上效果图:

图片轮播组件gallery slider怎么用

wxml


 
  
    
      
       
        
         
        
        
         
        
       
      
    
  
 

wxss

.imgw{width:100%;}

js

/**
 *页面的初始数据
 */
data: {
 banner_url: data.bannerList(),
 open: false,
 indicatorDots: true,//是否显示面板指示点
 autoplay: true,//是否开启自动切换
 interval: 3000,//自动切换时间间隔
 duration: 500//滑动动画时长
}

最终效果:

图片轮播组件gallery slider怎么用

总结:

1. scroll-view组件的作用是可以触发触摸滑动
2. swiper组件的作用是制作图片自动切换,形成轮播
3. navigator组件的作用是给每个图片添加链接
主要是scroll-view和swiper两个组件制作成可滑动的轮播组件。

感谢各位的阅读!关于“图片轮播组件gallery slider怎么用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


分享题目:图片轮播组件galleryslider怎么用
网站地址:http://njwzjz.com/article/pjehjg.html