小程序引用官方swiper组件和案例,使用banner图的大小比例建议多少呀?
<view class="page-section page-section-spacing swiper">
<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
<block wx:for="{{imgUrls}}" wx:key="*this">
<swiper-item>
<image src="{{item}}" mode='aspectFill' />
</swiper-item>
</block>
</swiper>
</view>
肯定建议满宽度呀~高度的话,就随便了吧
<swiper indicator-dots=
"{{indicatorDots}}"
autoplay=
"{{autoplay}}"
interval=
"{{interval}}"
duration=
"{{duration}}"
style=
'height:{{Height}}'
>
<block wx:
for
=
"{{imgUrls}}"
wx:key=
"*this"
>
<swiper-item>
<!-- <image src=
"{{item}}"
mode=
'aspectFill'
/> -->
<!-- <image src=
"https://www.71big.com/heqing/zhaojingwang/common/images/banner1.jpg"
mode=
'widthFix'
/>
-->
<image class=
"slide-image"
src=
"{{item}}"
bindload=
'imgHeight'
mode=
'widthFix'
></image>
</swiper-item>
</block>
</swiper>
//轮播高度自适应——获取图片高度
imgHeight:
function
(e) {
var
winWid = wx.getSystemInfoSync().windowWidth;
//获取当前屏幕的宽度
var
imgh = e.detail.height;
//图片高度
var
imgw = e.detail.width;
//图片宽度
var
swiperH = winWid * imgh / imgw +
"px"
this
.setData({
Height: swiperH
//设置高度
})
}
不能非得程序控制吧,设计的人无法无天了,现在。还要前端修整尺寸。而且具体标准尺寸也不知道呀
你轮播的图的高度 都是不一样的吗?
一样的,但是有没有建议,比较好的标准尺寸,不会因为图片过大,导致加载慢