图片适应问题
像这种的话写什么代码可以解决?
像这种的话写什么代码可以解决?
2018-11-02
wxml代码:
<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="{{circular}}" indicatorColor="{{indicatorColor}}" indicatorActiveColor="{{indicatorActiveColor}}">
<block wx:for="{{imgUrls}}">
<swiper-item>
<image src="{{item}}" class="slide-image" width="355" height="150" />
</swiper-item>
</block>
</swiper>
样式:
swiper {
width: 100%;
height: 340rpx;
}
JS
data: {
// 轮播
imgUrls: [
'/images/banner/banner1.jpg',
'/images/banner/banner2.jpg',
'/images/banner/banner3.jpg',
],
// 是否显示面板指示点
indicatorDots: true,
// 是否自动切换
autoplay: true,
// 自动切换时间间隔
interval: 5000,
// 滑动动画时长
duration: 1000,
// 是否采用衔接滑动
circular: true,
// 指示点颜色
indicatorColor: "white",
// 当前选中的指示点颜色
indicatorActiveColor: "red",
},
注意:图片大小按iphone6的尺寸来,640x300像素即可。
举报