Adding JQuery UI Slider
Here are five easy steps to add slider functionality to your web applications:
Step 1: Go to JQuery UI site and create a custom download. To keep things simple, select “No Theme”.under theme section and deselect all but UI Core and Slider checkboxes. Hit Download and unzip the downloaded file.
Step 2: Copy the jquery-1.3.2.min.js and “jquery-ui-1.7.2.custom.min.js” files into your project. These files should be under the js folder. Include the js files in your html/jsp page.
Step 3: Add the following styles to the page:
Step 4: Add a DIV for the slider in the HTML.
Step 5: Initialize the slider in the document ready function:
That’s it. You can find a demo of this example here.