swiper组件轮播图片右边空白问题
刚开始使用iphone5预览正常,切换成iphone6 Plus之后,发现右边会有空白。所以尝试解决了。
一、原始代码与效果
官方swiper组件
https://developers.weixin.qq.com/miniprogram/dev/component/swiper.html
示例代码
<swiper indicator-dots="{{indicatorDots}}"autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"><block wx:for="{{imgUrls}}"><swiper-item><image src="{{item}}" class="slide-image" width="355" height="150"/></swiper-item></block>
</swiper>
<button bindtap="changeIndicatorDots"> indicator-dots </button>
<button bindtap="changeAutoplay"> autoplay </button>
<slider bindchange="intervalChange" show-value min="500" max="2000"/>
<slider bindchange="durationChange" show-value min="1000" max="10000"/>
实际效果图
二、修改
示例代码在 image 标签中设置了width和height,但这样看起来并没有生效,因为image标签中没有这两个属性,可能是官方文档新旧版本的出入吧。
解决办法:
将 width height 写在CSS中即可。
eg:
style="width:100%"
另一种可能性(没有遇到):http://www.wxapp-union.com/thread-2474-1-1.html