滑块拇指更容易抓住触觉设备

Question

我正在使用Bootstrap滑块，但是即使我把它做得很大，拇指也难以抓住触觉设备。

input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none !important;
width: 20px;
height: 20px;
background-color: #ECECEC;
border-radius: 30px;
box-shadow: 0px 0px 3px #3c6d59;
transition: all 0.5s ease;
border: none;
padding: 15px;
}

我尝试创建添加填充但不会改变感觉。我也尝试在拇指周围创建一个看不见的div，但我没有成功。

对任何建议开放， 干杯！

Answer 1

这就是我将滑块按钮放大的方法：

transform:scale(2);

上面的代码使滑块按钮 2次更大。

JSFiddle demo here