HTML垂直滑塊元素

希望快速 - 爲什麼我的滑塊元素不能垂直定向？我錯過了什麼？HTML垂直滑塊元素

謝謝！

CSS

div.CRHslider{ 
-webkit-appearance: slider-vertical; 
    data-orientation="vertical"; 
}

HTML

<div id="CRHslider"> 
Control Rod Height 
<br> 
0% <input type="range" name="ControlRodHeight" min="0" max="100" value="0" 
onchange="updateCRHSlider(this.value)" class="vertical" orient="vertical"/> 100% 
</div>

來源

2017-04-21 Deborah

顯示我的代碼比我會檢查？ –

嗨Lalit，代碼包含在我原來的問題。這不是關於滑塊功能（工作正常），只是方向。謝謝！ – Deborah

試試這個：

#CRHslider1 { 
    -webkit-appearance: slider-vertical; 
    data-orientation="vertical"; 
}

<div id="CRHslider"> 
    Control Rod Height 
    <br> 
    0% <input type="range" name="CRHslider1" id="CRHslider1" min="0" max="100" value="0" onchange="updateCRHSlider(this.value)" class="vertical" orient="vertical"/> 100% 
</div>

的jsfiddle：https://jsfiddle.net/david_black/3jot0pvx/

你的CSS不工作的原因是因爲它匹配div而不是輸入。

來源

2017-04-21 10:41:41

嗨大衛，謝謝你的回答，但我恐怕我不明白？我有兩個滑塊存儲在單獨的div - 如果我更改CSS，因此它不引用div，我如何區分它們？我可以引用滑塊ID並以這種方式定位它們嗎？謝謝！ – Deborah

是的，您可以將ID分配給兩個滑塊。那肯定會奏效。 –

太好了，謝謝！ – Deborah

HTML垂直滑塊元素

回答

相關問題