Changer le background d'un DIV on Hover sur autre DIV

iwebu -  
maka54 Messages postés 698 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je n'arrive pas a faire ce que je souhaites, et pourtant je sais que cela est possible !

Je m'explique, j'ai un DIV principal avec une photo en background que j'aimerais modifier lors du passage sur un autre DIV (bouton).

Voici mon CSS : 


#top-page-contact
{
position: relative;
margin: 0px auto;
background: url(http://www.iwebu.com/hedgeguard_v1/wp-content/themes/hedgeguard/images/fond-contact.png) no-repeat right top;
height: 263px;
width: 1100px;
text-align: center;
padding-top: 280px;
}

#boutonLondon
{
float: left; 
width: 200px;
height: 21px;
background-color: #f29413;
margin-top: 20px;
text-align: center;
font-family: 'Gotham A', 'Gotham B'; font-weight: 400; font-style: normal;
color: #fff;
font-size: 12.05px;
padding-top: 5px;
cursor: pointer;
}

#boutonLondon:hover + #top-page-contact
{
background: url(http://www.iwebu.com/hedgeguard_v1/wp-content/themes/hedgeguard/images/fond-contact.png) no-repeat right top;
}


Quelqu'un saurai pourquoi cela ne fonctionne pas ?!!

Merci à Tous !


A voir également:

2 réponses

Réponse 1 / 2
maka54 Messages postés 698 Date d'inscription   Statut Membre Dernière intervention   80
 
bonjour, et le html ressemble à quoi ?
0
Réponse 2 / 2
Ysabe_l Messages postés 12717 Date d'inscription   Statut Contributeur Dernière intervention   277
 
Bonjour,

Je ferais ça en javascript personnellement.

Genre en html si il y a

<div id="celle_a_changer"></div>
<div id="bouton_qui_fait_changer"></div>

En javascript : 

<script type="text/javascript">
	var monBouton = document.getElementById('bouton_qui_fait_changer');
	monBouton.addEventListener('click', changebackground);
	
	function changebackground {
		document.getElementById('celle_a_changer').backgroundImage='image2.jpg';
	}
		
</script>


C'est aussi possible si il y a plusieurs boutons et que chacun met une image de background différente, dans ce cas il faudra rajouter une variable.
0
maka54 Messages postés 698 Date d'inscription   Statut Membre Dernière intervention   80
 
c'est tout à fait possible de la faire en css mais il faut intervertir les deux div en html 

<div id="bouton_qui_fait_changer"></div> 
<div id="celle_a_changer"></div>

et en css 

#bouton_qui_fait_changer:hover + #celle_a_changer
0