Graphical ARIA Slider

This is a slider. It has two buttons on either end marked role:button and a slider in the middle marked role:slider. When you tab on to the slider and use the arrow, End and Home keys to change the value. Also just to draw people into using it, we have some mouse events. You can click on the buttons or drag the slider.

It is easy to adjust the width of the slider or the speed it changes. We just set two variables at the beginning of the JavaScript. Or to have different values for each slider with pop a script tag just before the slider with the values we want. The slider comes with a simple image preloader script for any images used in the css.

ARIA (Accessible Rich Internet Applications) is intended for use in XHTML so if you there is an XHTML example too. You can see the it in use in HTML below. You can also download it for your own use.