Friday, August 12th, 2005

Rich HTML Slider

Category: Examples

The gurus from webfx have long been on the scene showing us cool innovative ways of doing rich work on the web.

Now they have a nice demo of a dhtml slider


Posted by Dion Almaer at 10:02 am

3.8 rating from 37 votes


Comments feed

I was playing with a similar slider control for a project demo page (JS fireworks parameter controls). The sliders are animated as well via JS.

Demo here (down page a bit)..

I’m using DT/DD elements to classify the control “label” and expected range of values (eg. 0-100), the only missing item is a degradable input element (since this demo is for a JS library.) Actually using LABEL may have also been more semantically accurate than a DD in this case.

Comment by Scott Schiller — August 12, 2005

I used the webfx sliders in almost the same way to test colour contrast.

Comment by Jonathan Snook — August 12, 2005

It’s a shame none of the controls mentioned above is really accessible.
To achieve this, you’d need to allow the slider cursor to acquire focus (e.g. wrapping it in an a element) and also to handle keyboard events.

Comment by Rasqual — September 29, 2005

Excelent controll. Problem for me is that This (no one them actually) does not work in TouchScreen devices like Nokia Phones (Opera v11).

Fo addition can there be possibility to add Buttons somewhere to Increase / decrease the Slider position & value?

Button pressing must be so that when pushed down, it will continue valueChanage and perhaps gain some momentum aswell.. Releasesing the button, increase/decreas will stop.

Comment by jeremys — October 8, 2011

Leave a comment

You must be logged in to post a comment.