【小程序】wxml中的【scroll-view】左右拖动示例（图文+完整代码）

一、scroll-view图标左右拖动示例

1、 wxml代码：

        <scroll-view scroll-x="true" class="newCard_count">
     

                <view class="newCard_count_row ">
                    1
                </view>

                <view class="newCard_count_row">
                    2
                </view>

                <view class="newCard_count_row">
                    3
                </view>
                <view class="newCard_count_row">
                    4
                </view>
                <view class="newCard_count_row">
                    5
                </view>

        </scroll-view>

2、wxss代码

.newCard_count {
    width: 100%;
    height: 70px;
    background-color: #fa8b8b;
    white-space: nowrap;
}

.newCard_count_row {

    width: 130px;
    height: 60px;
    line-height: 60px;
    background-color: #eddede;
    display: inline-block;
    text-align: center;
    border: 1px red solid;

}

二、scroll-view去掉滚动条

在wcss中增加台下代码：

::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;   
}