Discussion :

[Décibel]

Bonjour,

Je ne sais pas si c'est possible ???
J'ai 2 div : div1 et div2
Je souhaite que sur le div1:hover un code CSS soit appliqué au div2.
Par exemple quand la souris passe sur le div1, le div 2 se transforme en CSS...

Une idée ?

[Bovino]

En règle générale, non, ce n'est pas possible. Ensuite, selon la structure du HTML, tu peux éventuellement regarder du côté des sélecteurs d'adjacence ou d'adjacence large.

[Invité]

Que penses-tu de l'idée de nous fournir le bout de code qui permettrait de voir la position relative de tes 2 div ?

Et ainsi savoir vers quoi t'orienter ?

[Décibel]

Pour le HTML

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<div class="div1">
   <div class="div2">Texte Texte Texte</div>
</div>

Pour le CSS du div1

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
.div1 {display:inline-block;margin:15px;width:300px;height:300px;background-image:url(fond1.jpg);cursor:pointer; border:3px #7C7069 solid;vertical-align: top;}
.div1:hover {background-image:url(fond2.jpg);border:3px #FFF solid;color:#FFF;	font-family: 'Roboto:100', sans-serif; font-weight:bold;}

Pour le CSS du div2

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.div2 {position:absolute;width:300px;height:100px;background-color:rgba(29, 68, 116, 0.8);transition:all .25s;color:#FFF;font-weight:100}

et ce que j'aimerais qu'il se passe sur le div2 quand la souris passe sur le div1

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.div2:hover   {transform:scale(1) translate();height:300px;}

En gros j'ai un carré de 300x300 px avec une image de fond qui change sur hover, mais j'aimerais aussi avoir un div dans le premier div qui contient le texte et qui se déploie en 0.25s dans le premier div quand la souris passe dessus...

Merci....

[Invité]

C'est le cas le plus simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.div1:hover .div2 {...}

[Décibel]

Cool, merci !!