响应式、多处理 HTML 5 或 javascript 范围滑块
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14127689/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Responsive, multi-handle HTML 5 or javascript range slider
提问by jcbfshr
I'm currently working on a responsive site and would like to employ a multi-handle range slider. I have worked with some javascript solutions that worked ok, but were not responsive.
我目前正在一个响应式网站上工作,并希望使用多手柄范围滑块。我使用过一些可以正常工作但没有响应的 javascript 解决方案。
I have considered the option of two html5 range inputs, which degrade gracefully to text inputs on older browsers. I would however, like to know if anyone has come across a javascript solution for a range slider with multiple handles, that works in responsive environments. Any ideas or tips?
我已经考虑了两个 html5 范围输入的选项,它可以优雅地降级为旧浏览器上的文本输入。但是,我想知道是否有人遇到过用于具有多个手柄的范围滑块的 javascript 解决方案,该解决方案适用于响应式环境。任何想法或提示?
采纳答案by Bastian Rang
i used the fd-slider polyfill/ with modernizr-loader, it was usable on the ipad. further devices were not tested, because the small-screen version didn't used them.
我使用了fd-slider polyfill/ 和Modernizr-loader,它可以在 ipad 上使用。其他设备没有测试,因为小屏幕版本没有使用它们。
回答by Lg102
You could have a look at noUiSlider.
你可以看看noUiSlider。
It supports touch on a bunch of devices, and it works well with responsive designs. There's no dependencies on jQuery etc.
它支持在一堆设备上触摸,并且可以很好地与响应式设计配合使用。没有对 jQuery 等的依赖。
Disclosure:I made it.
披露:我做到了。
回答by maslick
回答by Endre Simo
Try jQuery range slider: http://jqueryui.com/slider/#range.
尝试 jQuery 范围滑块:http: //jqueryui.com/slider/#range。
It's well supported among different browsers.
它在不同的浏览器中得到很好的支持。
回答by Renaud
These look really slick but I haven't tried them:
这些看起来很漂亮,但我还没有尝试过:
http://ghusse.github.io/jQRangeSlider/demo.html
http://ghusse.github.io/jQRangeSlider/demo.html
回答by dy_
回答by Mark
For those who still end up here, looking around for options, I came across this one:
对于那些仍然在这里寻找选择的人,我遇到了这个:
http://vanderlee.github.io/limitslider/
http://vanderlee.github.io/limitslider/
It allows you to pass an array of values, and even style the gaps between via an array of options.
它允许您传递一组值,甚至可以通过一组选项设置间隙的样式。


