微信小程序轮播图的高度自适应问题

我把 swiper 的 width 设定成了屏幕的95%宽度, 如果想宽度也自适应的话请改成  width:{{width*2}}rpx
[html]
<swiper class='advertising2' indicator-dots="true" style='height:{{height*2
+80}}rpx;width:95%;' autoplay="true" interval="4000" duration="1000">
<swiper-item wx:for="{{advertising2}}" wx:key=""> <view
class='store'>{{item.title}}</view> <!--
store的高度加内外边距为80rpx,所以在swiper的高度加上80rpx --> <view> <image
style='height:{{height*2}}rpx;width:100%;' mode="" src="{{item.image}}" />
</view> </swiper-item> </swiper>
 

wx.getImageInfo是官方获取图片信息的api ,
详细文档请查看 https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html#wxgetimageinfoobject 
[javascript]

wx.getImageInfo({ src: advertising2[0].image, success: function (res) {
that.setData({ height: res.height, width:res.width }) } })


效果图如下:




2.关于图片的自适应问题：



使用<image>的mode为widthFix，

• « 上一篇：R语言开发环境搭建图文教程（含教程和全部软件）10分钟入门
• » 下一篇：NodeJS简易博客系统（九）后台管理实现及项目总结