如何在不使用 jQuery 的情况下制作水平滑动条答案

【问题标题】：how to make a horizontal sliding bar without using jQuery如何在不使用 jQuery 的情况下制作水平滑动条
【发布时间】：2015-11-16 05:27:39
【问题描述】：

我正在使用ionic框架，不要使用jQuery。如何在不使用jQuery的情况下制作水平滑动条。

类似：

我尝试了以下代码：

<ion-scroll direction="x" class="wide-as-needed">
        <a class="button inline-button">this is a button : 1</a>
        <a class="button">this is a button : 2</a>
        <a class="button">this is a button : 3</a>
        <a class="button">this is a button : 4</a>
        <a class="button">this is a button : 5</a>
        <a class="button">this is a button : 6</a>
</ion-scroll>

我参考了：http://codepen.io/calendee/pen/HIuft

但在移动设备上，触摸在水平区域上方不起作用。

【问题讨论】：

如果你不想使用 jquery，那么试试这个链接，它会帮助你 -> menucool.com/javascript-image-slider
"但是在移动设备上，触摸在水平区域上方不起作用。"这句话不太明白？
@AaronSaunders 如果我尝试通过触摸 ion-scroll direction-x 下的屏幕区域来滚动屏幕，则滚动不起作用。
codepen 在这里会有所帮助
@AaronSaunders Ihere is a codepen - codepen.io/vinay885/pen/jPgmzx 它包含一个水平滚动的按钮，但问题是如果屏幕滚动使用该水平区域，则垂直滚动不起作用。如果您清楚，请告诉我。

标签： javascript jquery html css ionic-framework

【解决方案1】：

也许你可以使用这样的东西。

<div class="range-slider" data-slider>
  <span class="range-slider-handle" role="slider" tabindex="0"></span>
  <span class="range-slider-active-segment"></span>
  <input type="hidden">
</div>

【讨论】：

有没有css可以解决？