不用轮子自己写滑动块

我们要做的时移动端的滑动块组件，像这样

http://www.jq22.com/jquery-info16045

tab组件一般是一行显示的，如果数量太多怎么办

我们可以把多余的tab项隐藏，左右滑动查看

可滚动的水平导航
div.scroll{
display: flex;align-items:center;
justify-content:flex-start;
overflow-x: scroll; white-space: nowrap;
}

隐藏滚动条
div.scroll::-webkit-scrollbar{width:0;height:0}

滑块组件也可以作为图文组件

如

<div class="scroll2">
              <div class="jptj">
                <div>1元</div>
                <div>10模块</div>
                <div>1元</div>
                <div>10模块</div>
                <div>1元</div>
                <div>10模块</div>

              </div>
            </div>

.jptj {
    display: flex;
    flex-flow: nowrap;

}
.jptj>div {
    margin:10px;
    width:165px;
    height:80px;
    background-color: #eee;
    padding:0 auto;
}
div.scroll2{
  display: flex;align-items:center;
  justify-content:flex-start;
  overflow-x: scroll; white-space: nowrap;
}