css - iPad 垂直输入 slider

标签 css slider

我正在使用 jQuery UI 创建一个垂直输入范围 slider ( this style to be exact )。
我宁愿使用更轻量级的框架,如 Zepto,当然也可以使用原生 JS 来创建此 slider 。

我的具体用例仅适用于 iPad (iOS 4.3+),因此只需要 webkit 支持。 <input type="range" /> 的 CSS3 样式不是一个选项,因为它不能在垂直方向设置样式,并且 rotate(90deg)在 iOS 上无法正常运行。此外,iOS 4.3 根本不支持它。

谁能指出我更好的解决方案?

最佳答案

这可能是您想要的:

https://stackoverflow.com/a/8696975/1170982

我不确定 rotate3d 变换在 iOS 中如何不正确运行 - 我自己从未遇到过任何问题,但您也可以将“vertical-slider”值应用于变换:

-webkit-appearance: slider-vertical;

这是一个小预览:

http://jsfiddle.net/pSfSx/

关于css - iPad 垂直输入 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10342034/

相关文章:

css - Bootstrap 词缀

css - 对于 CSS 字体系列属性,设置 Initial 或不设置是否相同?

javascript - 滑动接触形式重新定位

android - 如何在两侧android中设置 slider

javascript - 可以使用 JQuery .each 函数为 ul 中的每个 li 创建链接吗?

javascript - 如何控制iosSlider中的动画速度?

css - 如何覆盖滚动条自动隐藏

css - 无法使用类型属性选择器在 IE7 中设置新的 HTML5 输入类型

html - 输入 :disabled and input[disabled] CSS selector 之间的差异

html - slider 革命与 Bootstrap 冲突