Conclusion to sliders

Now that scripting the slider regions is done, we have a finished and functional slider for our forms.

This post is part of a series that guides you through creating robust sliders for your forms.

1. Introduction to sliders
2. Accessible slider alternative
3. Basic requirements for sliders
4. Connecting the slider to the form
5. Scripting the slider regions
6. Conclusion to sliders (this post)

We have taken the scripting of some form questions from a basic yet functional beginning …

How the form looks without scripting

… and have made use of the jQuery UI library plus some scripting to create practical and easy to use sliders, that allow people to easily represent how they feel about things.

Slider form in use

Further progress from here might be to use a drop-down select to provide individualised region descriptions.

The slider bar is also capable of greater things than has been shown here. Instead of a smoothly sliding scale you can have fixed stopping points along the scale. You can also have two ends to the slider, so you can select a high point and a low point along the scale.

For a nice example of what can be done, Filament Group provide a plugin that turns the slider into a wonderfully accessible slider.

Accessible slider from Filament Group

So have fun playing around with the slider from jQuery UI, I’ll be interested to hear about what results you get from it.

Advertisement