web-dev-qa-db-fra.com

Comment afficher à la fois l'entrée et la sortie sur un curseur?

Je travaille sur une interface pour contrôler une LED à luminosité variable. Le choix évident pour moi est d'utiliser quelque chose comme un curseur. La LED peut être ajustée dans l'interface graphique ou à l'extérieur, donc je dois permettre à l'utilisateur de changer de paramètre et d'afficher également le paramètre actuel, il semble donc qu'un curseur ne soit pas l'idéal à cet égard.

Quelles sont les approches qui ont été utilisées pour afficher simultanément les entrées et les sorties dans un format de curseur? Quelle serait une bonne façon d'aborder ce problème?

1
Brian

je pense que c'est le cas du manuel car l'élément <output a été implémenté en html5. j'ai vu quelques exemples appelés boutons, qui montrent à la fois l'entrée et la sortie d'affichage: le bouton a un marquage dans une position, montrant à l'utilisateur où l'entrée est à tout moment; lorsqu'il allume le cadran, l'élément de sortie est utilisé pour éclairer le volume sélectionné à l'heure actuelle, sous la forme de lumières et d'ombrage changeant entre les icônes intégrées dans le matériel (généralement).
l'exemple Vanilla d'utilisation de <input type="range" /> et <output> en tandem est une version moindre de l'exemple de bouton:
stylisez le <input type="range" /> dans un bouton, tout en stylisant l'élément Eoutput> pour qu'il apparaisse comme un affichage numérique, mettant à jour dynamiquement par entrée utilisateur.

référence:
demosthenes.info/blog/757/Playing-With-The-HTML5-range-Slider-Input

2
albert