微信小程序scroll-view横向滚共不生效
<view class="a-scroll">
<scroll-view scroll-x class="my-scroll">
<view id="img1" class="s-item">
<image src="../image/timg.jpg"></image>
</view>
<view id="img2" class="s-item">
<image src="../image/战狼.jpg"></image>
</view>
<view id="img3" class="s-item">
<image src="../image/战狼2.jpg"></image>
</view>
</scroll-view>
</view>
css文件要求
一定要将scroll-view容器设置宽度,并设置white-space: nowrap;
一定要将scroll-view容器的每一项都设置宽度和display:inline-block
.a-scroll{
width: 100%;
height: 300rpx;
}
.my-scroll{
width: 100%;
white-space: nowrap;
}
.s-item{
width: 100%;
display: inline-block;
}
.a-scroll image{
width: 100%;
height: 300rpx;
}