javascript - 创建垂直 slider HTML 元素

Question

我正在尝试创建我自己的 HTML 元素，如下所示:

我想要创建的外观:我的尝试:

该小部件仅适用于网站的 iPad 版本，遗憾的是我无法使用 JQuery。

我的问题:我正在尝试向小部件添加 slider /箭头，但我不知道如何操作？是否有一个带有箭头 slider 的 webkit 外观？小部件上是否可以有一个 slider 箭头？

我的代码:

<div style="background-color: rgb(191, 326, 383); width: 200px;">
    <ul style="list-style: none; -webkit-appearance: slider-vertical; width: 200px; height: 300px; margin: 0;">
        <li>jddsjh -</li>
        <li>jddsjh -</li>
        <li>jddsjh -</li>
        <li>jddsjh -</li>
    </ul>
</div>

Answer 1

input[type="range"] {
    position:absolute;
    -webkit-transform: rotate(90deg);
    top:100px;
   
}

<input type="range">