[Résolu] Modifier une image grâce à une autre image

Bonjour,
Je post ici ma première question concernant l'utilisation de CSS, en espérant une réponse .

Voilà, j'aimerai crée un bouton avec une image dans un "div", qui, lors d'un survol, va changer le contenu d'un autre "div" (lui faire passer le "display" de none à block, par exemple).

A noter que les images présentes dans les des deux "div" ne sont pas des background.

Pour une meilleur compréhension je reformule un coup avec un exemple :

J'aimerai qu'un "div" (qui contient un lien) avec ce style attribué :

#flag-fr {
		float:right;
		padding-right: 80px;
		padding-top: 8px;
		margin-left: 10px;		
	}

Modifie la valeur du display d'un autre "div" qui a ce style :

#icone-fr {
		display:none;
	}

Es-ce possible ??? Si oui, comment ???
Merci de votre attention.
Modifié par teo (22 May 2006 - 19:14)

Salut et bienvenu

c'est comme a la SNCF c'est blesipos

va voir
http://css.alsacreations.com/Tutoriels-et-articles-divers/Afficher-Masquer-des-calques-sans-javascript

A+

En utilisant du javascript associé à l'action onMouseOver...

<script>
function changDiv(){
cible = document.getElementById("[id de ton second div]");
cible.style.display = block;
}
</script>

<a href="#" onMouseOver="javascript:changeDiv()">



si tu veux rendre le script un peut plus universel, tu passes l'id du second div en argument dans l'appel javascript et tu le traites comme une variable ensuite...

<script>
function changDiv(choix){
cible = document.getElementById(choix);
cible.style.display = block;
}
</script>

<a href="#" onMouseOver="javascript:changeDiv('[id de ton second div]')">


note: attention, en javascript les attribut de style porte pas le même nom qu'en CSS, notamment au niveau des background.

Voili...

Pour gege71

Dans ce cas précis, il veut agir sur un autre div par sur celui où la souris passe... L'exemple d'alsacecréation concerne un seul div...

Faut lire les questions

Mais j’ai lu la question

Mais il peut avoir le même effet que dans un div il suffi de remplacer la cible div par un span en bloc et une position absolue

Avantage ça reste standard et fonctionne même si le javascript est désactivé

Deuxièmement nous somme sur la rubrique CSS du forum

A+

Autre exemple

http://www.cssplay.co.uk/menu/mytv.html

A+

Bonjour aepron,

aepron a écrit :
En utilisant du javascript associé à l'action onMouseOver...

<script>
(...)

Merci d'éditer ton message et d'utiliser les balises [ code] ... script ... [ /code] (sans les espaces) pour que ce soit nettement plus lisible pour tout le monde comme demandé dans l'Aide du Forum

Merci,
Felipe

Merci a vous deux pour ces réponses !

La solution de gege71 répond à mon besoin même si elle ne répond pas à ma question.

Car je pense que ce que je voulais faire au départ n'est possible qu'en utilisant du javascript (d'où la réponse de aepron).

Dans l'exemple de gege71 on reste dans la modification de la balise <span> qui est un enfant de la balise <a> .
Ma question était de savoir si il est possible de modifier le contenu d'une balise qui n'est pas enfant de la balise <a>.
Mais je pense que non ...

En tout cas mon problème de réalisation est résolu.

Encore merci à vous deux.

a écrit :
Ma question était de savoir si il est possible de modifier le contenu d'une balise qui n'est pas enfant de la balise <a>.
Mais je pense que non ...

Avec les navigateurs conformes, on peut faire cet effet de masquage/affichage au survol de différentes balises ou sélecteurs (liste, blocs div, champs...).
Seulement, pour un soucis de compatibilité avec IE, on ne se sert bien souvent que d'une balise A, la seule sur laquelle ce navigateur sait appliquer la pseudo-classe :hover. Et comme A n'accepte que peu d'enfants, on est vite limité.