使用 JavaScript 的范围选择器
我想创建一个非常简单的范围选择器,但我遇到了 3 个问题 1. HTML range标签仅适用于chrome和safary。如何创建一个可以在其他浏览器上运行的浏览器?
如何使其垂直?
如何控制滚动按钮本身?我想改变它的图像,并根据滚动来改变它的大小。
谢谢
I want to create a very simple range picker, but I'm having 3 problems
1. the HTML range tag works only on chrome and safary. how can I create one that works on other browsers?
How do I make it vertical?
How can I control the scrolled button itself? I want to change it's image, and to change it's size according to the scrolling.
thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
Range标签是html5定义的元素。如您所知,并非所有浏览器都完全支持 html5,因此目前最好使用替代方案,例如 jquery,这是实现浏览器兼容的最安全方式。
关于垂直滑块的第一个问题: http://jqueryui.com/demos/slider/#range -vertical
至于你的第二个问题,最好使用自定义控件。使用 jquery 范围滑块,您可以连接滑块事件并根据值更改某些元素的属性。查找滑块的 api。
看看他们是如何改变颜色值的。例如,您可以通过更改图像的大小来执行相同的操作。
http://jqueryui.com/demos/slider/#colorpicker
Range tag is html5 defined element. As you know, html5 is not fully supported in all browsers, so for the time being, it's best to use alternative, like jquery which is the safest way to be browser compatible.
Your first question for the vertial slider: http://jqueryui.com/demos/slider/#range-vertical
As to your second question, it's really best to use custom control. Using the jquery range slider, you can hook up to the slider events and change the property of some element according to the value. Look up the api for the slider.
Check out how they do it with changing the color value. You can do the same with changing the size of an image for example.
http://jqueryui.com/demos/slider/#colorpicker
一般来说,最好的选择是放弃
表单字段并选择 jQuery UI 范围滑块。
In a general sense, your best bet is forgoing the
<input type="range"...>
form field and opting for the jQuery UI range slider.JQuery UI 有一个广泛的表单元素库,我认为它们也向后兼容旧版本。
试试这个网址:http://jqueryui.com/demos/slider/#range
JQuery UI has an extensive library of form elements and I think they are also backward compatible with older versions.
Try this URL: http://jqueryui.com/demos/slider/#range