微信小程序-scroll-view左右滑动

效果：

wxml页面：

  <view class="section section_gap">
    <scroll-view class="scroll-view_H" scroll-x="true">
      <view class="scroll-view-item_H" wx:for="{
  {hotList}}" wx:key="{
  {item}}">
        <image src="{
  {item.pic}}"class="scroll-image"/>     
      </view> 
    </scroll-view>
  </view>

对应的wxss:

.section{
  width: 100%;
  margin-top:10px;
}

.scroll-view_H{
  height:210rpx;
  display: flex;
  width: 100%;
  white-space: nowrap;

}
.scroll-view-item_H{
  width:300rpx;
  height:210rpx;
  margin-right:5rpx;
  display: inline-block;

}
.scroll-image{
  width:300rpx;
  height:210rpx;
  display: