Archives for: January 2009
Slider plugin that coordinates with HTML select boxes
by Jack K
The Filament Group has been real busy lately bringing lots of goodness to jQuery and jQuery UI. Actually, the stuff is pretty amazing... I'm so happy they're on board with the jQuery projects. I think their contributions are going to play a significant role in the increasing use of jQuery and jQuery UI. OK, enough on that, let's get on with this neat thing....
If you're ready to dive into using jQuery UI 1.6 (which is on RC5 now and should be out this week) and are looking for a cool slider control that will work hand-in-glove with the values in one or more HTML select boxes (and has nice themes), check out their select-to-slider plugin:
http://www.filamentgroup.com/lab/update_jquery_ui_16_slider_from_a_select_element/
If you're not sure what the heck I mean, take a look there: the demo's show it in action. With a great deal of attention spent on making the control use progressive enhancement, you can create a slider that is bound to one select box and drag the slider's 'knob' (I like that word) to change the selected value in the select box. Want two knobs (and who doesn't)? Use two select boxes with two knobs on the slider. There's also a slick optional feature that translates select box option groups into a sort of "timeline" list below the slider. I can think of lots of uses for that.
Oh, and the knobs have a "tooltip" option, too, which looks great. Lotsa love here. Can't wait to use this in something new.
01/21/09 10:56:50 am, 