Boutons de formulaire

LEVEQUE · Message par **LEVEQUE** » 26 juin 2005, 17:26

Je suis en train de refaire mon site (initialement conçu pour MSIE avec ses particularités) et cela se passe assez bien (en grande partie grâce à ce forum).
Mais je bute sur le problème suivant : Comment mettre une image sur un bouton de formulaire ?
L'utilisation d'un style avec background-image: url(image.gif) marche bien avec MSIE mais pas avec Firefox.
Y a-t-il une autre solution ou suis-je condamné au triste bouton gris avec du texte ?
Par avance, Merci !

calimo · Message par **calimo** » 26 juin 2005, 17:39

Il y a pas <input type="image" alt="..."> qui est conçu exprès pour ça ? (attention à ne pas oublier le texte alternatif !)

LEVEQUE · Message par **LEVEQUE** » 26 juin 2005, 18:25

Oui bien sûr mais ce n'est pas un vrai bouton (qui s'enfonce quand on clique dessus...

)
Ce n'est certes pas fondamental mais c'était une solution simple et esthétique dans le cas qui me concerne (boutons rewind, forwind, rewind fast et forwind fast pour naviguer dans un diaporama géré en javascript).
Je crois que je vais garder les "vrais" boutons en remplaçant les images par du texte : >> >>| << et |<< mais... c'est moins beau !
Merci de la rapidité de la réponse.

Humpfff · Message par **Humpfff** » 26 juin 2005, 18:37

Avec CSS, tu peux donner plusieurs "états" aux boutons.
Un exemple => http://mammouthland.free.fr/cours/css/cours6.php

PsyDk · Message par **PsyDk** » 26 juin 2005, 18:41

LEVEQUE a écrit :Je suis en train de refaire mon site (initialement conçu pour MSIE avec ses particularités) et cela se passe assez bien (en grande partie grâce à ce forum).
Mais je bute sur le problème suivant : Comment mettre une image sur un bouton de formulaire ?
L'utilisation d'un style avec background-image: url(image.gif) marche bien avec MSIE mais pas avec Firefox.
Y a-t-il une autre solution ou suis-je condamné au triste bouton gris avec du texte ?
Par avance, Merci !

Heu, rien ne s'y oppose. Ou alors j'ai du mal à comprendre le problème. Aurais-tu un exemple de code s'il te plait ?

calimo · Message par **calimo** » 26 juin 2005, 19:20

LEVEQUE a écrit :Oui bien sûr mais ce n'est pas un vrai bouton (qui s'enfonce quand on clique dessus... )
Ce n'est certes pas fondamental mais c'était une solution simple et esthétique dans le cas qui me concerne (boutons rewind, forwind, rewind fast et forwind fast pour naviguer dans un diaporama géré en javascript).
Je crois que je vais garder les "vrais" boutons en remplaçant les images par du texte : >> >>| << et |<< mais... c'est moins beau !
Merci de la rapidité de la réponse.

Ah, dans ce cas ce n'est pas vraiment un formulaire alors s'il s'agit de liens

Dans ce cas il faut effectivement faire un lien "normal", et tu le styles en CSS. background-image marche très bien dans Firefox (c'est dans IE que ça ne marche pas comme il faut, si tu as mis un background-attachment:fixed sur autre chose que le body IE ne le supporte pas).
Tu peux styler avec a:hover (survol par la souris) a:active (quand c'est cliqué), etc

LEVEQUE · Message par **LEVEQUE** » 26 juin 2005, 19:22

O.K. Merci à tous ! Effectivement il n'y a pas de raison que ça ne marche pas sauf à avoir écrit une bêtise (ou plutôt un copier-coller raté...)

Geckozone