Problème utilisation tutoriel:Faire une zone réactive en CSS

Question

numero7

23 May 2006 à 18:11

Bonjour!
Je me sers de ce tutoriel concernant le zoom sur une image.
Je n'ai pas réussi à me servir du premier c'est pourquoi j'utilise le second.
Cependant j'arrive à l'utiliser seul, mais je n'arrive pas à l'intégrer dans mon code.
A cette adresse http://www.jas-aventure.fr/vous constaterez que je désire mettre un lien sur l'affiche plan.
J'ai construit ma page de cette façon : tout le panneau est un conteneur dans lequel j'ai placé des balises div pour créer des liens des affiches vers d'autres pages.
Cela fonctionne jusqu'a ce que j'installe ce code. Je pensais remettre des balises div pour l'affiche plan, mais ça ne fonctionne pas.
Auriez-vous une idée? Merci.

Voici le code

<body bgcolor="#087b2b" text="#000000">
<div class="conteneur">

  <div class="haut"></div>
  
  <div class="gauche"></div>
  
  <div class="panneau2"> 
  	<a class="zone1" href="activites.html" title="liste des activites proposées"></a> 
    <a class="zone2" href="liens.html" title="liste des liens"></a> <a class="zone3" href="tarifs.html" title="liste des tarifs"></a> 
    <a class="zone4" href="photos.html" title="galerie photos"></a> <a class="zone5" href="parcours.html" title="parcours et ateliers"></a> 
    
<div style="display: none;"><img alt="" src="zone1.jpg" /></div>

<div id="image">
	<a id="zone1" href="#" title="ou nous trouver"></a>

</div>	 
	
  </div>
  
  <div class="droit"></div>
  
  <div class="bas"><a class="contact" href="contact.html" title="Comment nous joindre"></a> </div>

</div>

</body>

voici le code CSS


#image {
position: absolute;
width : 576px;
height: 432px;
background: url(images/panneau2.jpg) top left no-repeat;
}
#zone6 {
position: absolute;
width : 91px;
height: 125px;
left: 402px;
top:160px;
}

#zone6:hover {
width : 364px;
height: 504px;
left: 100px;
top: 10px;
background: url(images/plan.jpg) top left no-repeat;
z-index: 100;
}

Modifié par numero7 (23 May 2006 - 18:13)

Sujet clos