在歌剧中,我可以做到以下几点
<style>
#range{
width: 20px;
heigth: 300px;
}
</style>
<input type="range" id="range" />
它将呈现一个垂直滑块.但是,这似乎不适用于chrome.有没有办法可以做到这一点？ (我不是在寻找任何jQuery滑块或任何东西)
解决方法
似乎Chromium还没有实现对此的支持：
见：http://www.chromium.org/developers/web-platform-status/forms
Not available yet
- Localization of
- Dedicated UIs for color,date,datetime,datetime-local,month,time,
and week types- Automatic switching to vertical range
- Value sanitization algorithms
- datalist element,list attribute,and list/selectedOption properties
编辑：Vuurwerk indicated实际上可以使用-webkit-appearance：slider-vertical属性更改演示文稿.虽然这确实将它转换为垂直滑块,但我不建议这样做,因为它会破坏你的布局并且看起来不太漂亮：example.
如果您确实需要垂直滑块,请使用JavaScript solution.支持< input type =“range”/>目前是非常基本的,所以你最好采用优雅降级或渐进增强方法.
