Un slider (sélectionneur de valeurs) accessible avec jQuery

[j0k3r_n0ir]

Depuis le temps que je cherchais un slider digne de ce nom, en Javascript et qui me permettait de prendre une sélection de valeurs qui ne soit des dates !! Je l'ai enfin trouvé. Certes j'utilise prototype plutôt que jQuery, mais déjà el fait d'en avoir trouver un, ça me soulage.

Bon tout d'abord, un slider c'est quoi?
J'appellerai un slider, un sélectionneur de valeurs. Il permet en effet de sélectionner une fourchette de valeurs pour faire une sorte de filtre. Dans l'idée, ça serait de définir un prix minimum et un prix maximum. Le premier acteur français à l'avoir fait sur son site eCommerce, est Darty (lien externe) (il me semble).

La plupart des scripts Javascript, disponible sur la toile, permettant de mettre en place des sliders, permettent bien souvent de sélectionner une période entre deux dates. Et il n'est généralement pas simple de transformer ce slider de date en slider de valeur numérique. Le slider, certainement le plus connu, est le slider de YUI (lien externe). Très bien fait, mais utilisant YUI justement. Ce qui n'est pas très pratique quand on est partis sur un choix de librairie Javascript différent.

Filament Group propose un slider accessible qui offre la possibilité de sélectionner des dates mais aussi des valeurs quelconque ; cela peut très bien être :
- des chaines de caractères ("très lent", "lent", "rapide", "très rapide")
- des dates
- ou des chiffres !

L'idée est en fait de convertir une ou plusieurs listes déroulantes en un slider. Ainsi, si Javascript n'est pas activé et/ou que les CSS non plus, le slider affichera des listes déroulantes qui permettront facilement de sélectionner une valeur.
L'exemple le plus basique et très parlant présente une simple liste déroulante qui se transforme en slider. Il suffit d'aller sur la page (lien externe) et de désactiver les CSS.

Enfin, un script de slider (lien externe) pratique qu'il serait intéressant de voir porter sur prototype.
_________________
La vie au fond, ce n'est qu'un court passage sur Terre.
Alors ne soit pas con, profites de tout ... fini ta bière !

[spike2]

Je crois que ce site utilise aussi ce système, non ?

http://www.materiel.net/ctl/Cartes_graphiques/

Du moins la partie carte graphique, puis dans cette page dans les Filtres par caractéristiques, y a "tranche de prix" qui est modulable.

Enfin je m'y connais pas encore trop sur ce point là ! Mais pour avoir regarder les JS utilisés, je pense que ça en ait aussi.

Pratique

[j0k3r_n0ir]

Ah oui, intéressant. Moins sexy que les autres, mais intéressant toute de même
_________________
La vie au fond, ce n'est qu'un court passage sur Terre.
Alors ne soit pas con, profites de tout ... fini ta bière !