Affichage par un click

Bonjour,

Je souhaite afficher une div qui pour le moment fonctionne au survol mais je voudrais, en click. C'est à dire quand je clique sur le lien.

Voici le code html:

<span id="carte">
     <a href="#">Cliquez pour afficher la carte

  <div id="afficheur">
  </div>

     </a>
</span>

Et le css :

#afficheur{
	position:absolute;
	background: url(../images/carte.png);
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width:1099px;
	height:727px;
	z-index: 100;
}

#carte div {
visibility:hidden
 }
#carte:hover div {
visibility:visible
}

Merci

F.
Modifié par fuerchan (25 May 2010 - 22:38)

Très rapidement en passant. Il y a peut être une faute de frappe ou quoi mais le principe y est.

le lien dans ta balise lien :
javascript:document.getElementById("afficheur").style.display = "block";

et tu ajoutes display : none; dans ton css pour #afficheur
Modifié par pixelb (25 May 2010 - 22:45)

Salut,

<span id="carte">

<span> étant une balise en ligne, il serait préférable de la remplacer par <div> à mon avis.

Bonjour,

Alors, j'ai ajouté : onClick="document.getElementById('afficheur').style.display='block';"
dans mon lien. Ajouté : display : none; dans #afficheur
(Changé span par div)
Mais rien en se passe. La div ne s'afficher toujours qu'au survol.

HTML :

<div id="carte">
                <a href="#" onClick="document.getElementById('afficheur').style.display='block';" >Cliquez pour afficher la carte
                    <div id="afficheur2">
                    </div>
                </a>
            </div>

CSS :

#afficheur2{
	background: url(../images/img_ecran/menu1.png);
	position:absolute;
	margin:0;
	width:500px;
	height:500px;
	z-index: 100;
	border:1px solid white;
	display : none;
}



#carte div {
visibility:hidden
 }

#carte:hover div {
visibility:visible
}

Merci.
F.

onClick="document.getElementById('afficheur2')

tu as oublié le 2

Bonjour,

Effectivement. J'ai corrigé mais ça ne fonctionne toujours pas comme il faut...

En fait lorsque la page s'affiche et que je clique sur le lien, c'est bon, la div s'affiche.
Mais ensuite elle réagit uniquement au passage et plus au clic. Il faut que je rafraichisse la page pour avoir de nouveau le clic !!

Merci encore
F.