Modifier la position du curseur dans une barre

Hello.
J'aimerais afficher un petit gadget mais impossible de trouver un renseignement dessus, comment faire ou même comment cela s'appelle pour pouvoir continuer mes recherches.

Il s'agirait d'afficher une barre horizontale avec un curseur dessus qui représenterait une valeur. On devrait pouvoir déplacer ce curseur sur la barre pour changer la valeur (par exemple si le curseur est tout à gauche on est à 0 et ça augmente vers la droite).

J'espère être assez clair dans ma description car je n'ai aucune idée du nom que cela porte.

Merci d'avance.

tu parles de trucs comme ça ?
http://www.blueshoes.org/en/javascript/slider/

Yes! c'est dans ce style là je te remercie beaucoup. J'ai pu faire un début du coup avec ton aide, merci.
Idéalement le cahier des charges ressemble à cela

Il me manque principalement la gestion des couleurs qui changent en fonction de la position du curseur.

juste un div de couleur différente dont tu modifies le with

C'est bon tout marche super bien je te remercie pour ton aide. :D