changement d'image et de couleur au survol

  • Auteur de la discussion Auteur de la discussion spalie
  • Date de début Date de début
Nouveau WRInaute
salut à tous,

je suis en train de créer une page de recherche avancée et j'aurais voulu
qu'au passage de la souris le texte change de couleur.
Ensuite lorsqu'on clique sur le texte, la petite image (fleche vers la droite) se transforme en une autre image que j'ai crée (fleche vers le bas).

La petite image est dans une div "fleche" et le texte est dans un td ayant une class "titre_choix"

Code:
<td class="titre_choix" colspan="2"><div id="fleche"></div> Choisissez les mots clés qui correspondent à votre recherche : </td>

choix.jpg


je sais faire en CSS avec le 'hover' mais sachant que la question n'est pas un lien, IE ne l'accepte pas.

et si possible si la fleche pouvait rester vers le bas apres le clique.


En fait tout ça c'est pour afficher le contenu de la question qui sera caché

si vous avez un idée ?
merci
 
Nouveau WRInaute
Salut,

tu devrais utiliser du javascript avec onMouseOver/Out avec les commandes

this.className='TonStyle' sur tes textes (dans une div par exemple) qui te permettra donc de changer la couleur et

this.src='tonImageRoll' sur l'image.

Je ne connais pas en CSS :)

++
 
Nouveau WRInaute
Salut,

Je n'ai pas tout compris mais bon !
Déjà un div dans table ... oups
pour la couleur du texte :
Code:
<td class="titre_choix" colspan="2"><div id="fleche"></div><span> Choisissez les mots clés qui correspondent à votre recherche : </span></td>

Code:
span:hover
{
color: #e9001d:
....
}

mais c'est vraiment du bidouillage, le mieux serait sans tableau.
http://pompage.net/pompe/cssdezero-13/
 
WRInaute passionné
The ghost, il est en théorie possible de faire ce genre de code sur n'importe quelle balise mais en pratique seuls les navigateurs récents le peuvent. IE 6 (en inf) lui ne le fait que pour les liens ... :roll:

Donc solution à éviter :wink:
 
Nouveau WRInaute
Bonjour,

Effectivement, pour y pallier on peut faire du bidouillage sur le bidouillage ...
Code:
	<a href="#">
	<span>texte</span> 
	</a>

Mais ce n'est pas très orthodoxe ... et je n'ai pas voulu trop insister.

Au fait je n'ai jamais éssayé un hover sur un form
 
Discussions similaires
Haut