How can I have 2 sliders for a form value in jquery?

Question

I am sure this is possible but I have not been able to find an example or anything yet.

I have a search form on my site where users can search for other users bas on there age range, for example there is 2 dropdown list with age numbers like 16-35.

Is there a way to have a horizontal line and have numbers accross it and 2 objects I can slide back and forth to a number? I have seen it before but not in jquery

Answer 1

The jQuery UI library has just what you are looking for:

http://jqueryui.com/demos/slider/#range

Answer 2

Another option is this jQuery extension, which will convert two select elements to a slider:

http://www.filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/

If you are using specifically defined values rather than a continuous range, it may be a more suitable option. It also provides the benefit of graceful degradation.