Affichage et disparition d'une div en jquery

[Résolu/Fermé]
Signaler
-
Messages postés
2465
Date d'inscription
mardi 22 janvier 2008
Statut
Membre
Dernière intervention
8 juin 2016
-
Bonjour,

Je souhaiterai afficher et faire disparaitre une div comme dans cet example de menu :

http://www.sushishop.fr/catalogue-produit-sushi

où la div / image apparait au survol d'un lien et ne disparait qu'au survol d'un autre lien, pouvez vous m'aider s'il vous plait merci

:o)

2 réponses

Messages postés
2465
Date d'inscription
mardi 22 janvier 2008
Statut
Membre
Dernière intervention
8 juin 2016
226
Salut ...

Y a multiple façon de la faire, en voici une, je dirai pas que c'est la meilleure, mais en tout cas ça fonctionne tres bien ...

<html>
<head>
<script type="text/javascript" src="jquery.js"></script> 
<script>
$(document).ready(function() {
	$(".items td").hover(function(){
		$("#display img").css('display','none');
		
		name_img = $(this).attr('id');
		
		img = $("#display").find('#'+name_img+'_dis');
		img.show();
	});
});
</script>

<style>
.items td {
	padding:0 10px;
	cursor:pointer;
}

#display img {
	display:none;
	float:left;
}
</style>
<head>
<body>

<table>
	<tr class="items">
		<td id="img1">Twitter</td>
		<td id="img2">Digg</td>
		<td id="img3">MySpace</td>
	</tr>
	<tr>
		<td id="display" colspan="3">
			<img src="http://www.seriessub.com/index.html" style="display:block;" id="img1_dis">
			<img src="http://amelioration.fr/wp-content/uploads/2010/08/icon_digg256.png" id="img2_dis">
			<img src="http://www.openpeillo.com/images/myspace-logo.png" id="img3_dis">
		</td>
	</tr>
</table>

</body>
</html>

PS : n'oublie pas d'inclure le framework JQUERY.

a+
Parfait tu m'as vraiment aider Merci
Messages postés
2465
Date d'inscription
mardi 22 janvier 2008
Statut
Membre
Dernière intervention
8 juin 2016
226
;)