jQRangeSlider is a jQuery plugin to create a powerful slider for selecting value ranges, supporting dates and more.
FEATURES
- Touch Devices - jQRangeSlider supports touch devices: tested with iOS and Android. User can select a range simply by touching and swaping on his tablet or phone.
- Steps - jQRangeSlider supports steps for both numerical and date values. Select values 5 by 5 or month by month, simply by changing an option.
- Adapt To Your Style - jQRangeSlider comes by default with two themes to demonstrate its ability to be restyled. You can customize it as you want: nothing is hard coded..
- Real Time Refresh - jQRangeSlider exposes events you can use for refreshing your UI. You can also interact with it through javascript methods.
- GPL + MIT - jQRangeSlider is open source published under dual license GPL and MIT. You can use it in both open source and commercial software.
Looks really nice. Especially I like how it handles situations were handles collide or go over each other. For example http://jqueryui.com/slider/#range just places both handles on top of each other and refuses to move the other, which can be really confusing. Awesome.
Love it. Will definitely be adding this to one of my side projects as soon as I get a chance. I haven't looked at the code yet, but I wonder if anybody as looked at using this for normal sliders as well, so as to get the same look and feel for all the sliders on a page irregardless of their type.
Great work. I had to build one of these a few months ago. This would have saved me a lot of time. Only addition I would want is multiple stops on the same slider.
Touch performance is pretty weak on iPhone 4S. Though that could be due to webkit, I think it might make more sense to increase the touch region (at this point, it seems to only respond when you touch the text.
I'm the author of this plugin, and first of all : thanks for your comments!
About the static image, I preferred a faster homepage to load. But according to your comments, I will at least create a link to the demo with this image.
This way, clicking on it will redirect you to the demo.
Great job on the plugin - one of the rare jQuery plugins to make the frontpage! Should tell you that you've created something awesome :)
re. the demo on the frontpage - even I was left trying to manipulate the image of the range slider on the homepage. Having a simple demo on the homepage would be nice!
Having said that, what prompted you to create this plugin? The concept of the range slider? Which purpose do you see it best serve?
I'll second everyone's comments - make the slider on the homepage functional, the first instinct when you see it is to try it out, and it's disappointing when it does not work.
Will examine tomorrow or laptop, but all examples are badly broken on nexus 7. Drop me an email if you want screen grabs and more feedback. Love the idea, thought.
18 comments
[ 5.3 ms ] story [ 53.1 ms ] threadjQRangeSlider is a jQuery plugin to create a powerful slider for selecting value ranges, supporting dates and more.
FEATURES
- Touch Devices - jQRangeSlider supports touch devices: tested with iOS and Android. User can select a range simply by touching and swaping on his tablet or phone.
- Steps - jQRangeSlider supports steps for both numerical and date values. Select values 5 by 5 or month by month, simply by changing an option.
- Adapt To Your Style - jQRangeSlider comes by default with two themes to demonstrate its ability to be restyled. You can customize it as you want: nothing is hard coded..
- Real Time Refresh - jQRangeSlider exposes events you can use for refreshing your UI. You can also interact with it through javascript methods.
- GPL + MIT - jQRangeSlider is open source published under dual license GPL and MIT. You can use it in both open source and commercial software.
The sliders are extremely nice by the way!
I'm the author of this plugin, and first of all : thanks for your comments!
About the static image, I preferred a faster homepage to load. But according to your comments, I will at least create a link to the demo with this image.
This way, clicking on it will redirect you to the demo.
re. the demo on the frontpage - even I was left trying to manipulate the image of the range slider on the homepage. Having a simple demo on the homepage would be nice!
Having said that, what prompted you to create this plugin? The concept of the range slider? Which purpose do you see it best serve?