Boutons radio HTML appelés boutons à bascule

Question

Au lieu d'avoir les disques typiques avec des étiquettes à droite, je veux que les options soient présentées sous forme de boutons cliquables. L'option sélectionnée devrait apparaître comme étant enfoncée ou enfoncée.

Je veux le faire en HTML, mais les boutons en haut à gauche dans le programme Audacity où vous sélectionnez le mode curseur/outil en sont un exemple.

Quelle est la meilleure façon de faire cela?

alt text http://freemusicsoftware.info/screenshots/audacity-linux-small.jpg

Answer 1

Il y a un certain nombre de plug-ins JavaScript pour ce faire:

• Prototype demo

Il suffit de remplacer les images qu'ils utilisent avec vos images et vous devriez être bon d'aller.

Answer 2

Probablement la meilleure façon est de créer un vrai bouton radio, puis contrôler le rendu d'un élément en fonction de l'état sur le bouton radio avec javascript. Si le bouton radio est sélectionné, affichez background-a, sinon background-b (ou utilisez une image-objet). Contrôlez l'état du bouton radio via l'événement click de votre élément personnalisé.

Answer 3

En utilisant this jQuery UI plugin, vous pouvez personnaliser les cases d'option et/ou les cases à cocher à l'apparence souhaitée.