Web 2.0
Multimédia
Internet
Programmation...

Raphael Lecerf

Développeur Multimédia à l'Université Lille 3
 

Afficher / Cacher une DIV au clic en CSS


20 septembre 2016 LABO & TESTS


Il est parfois utile de cacher un élément complémentaire dans une page et non utile à la première lecture pour le visiteurs (compléments d'information, illustration...)

Nous allons utiliser le CSS pour cacher cette DIV.

 

le code CSS :

<style type="text/css">
#afficher {
   width:500px;
}
#divjoconde {
   display:none;
   background: #ddd
}
#afficher:target #divjoconde {
   display:block
}
.masquer {
   display:none;
}
#afficher:target .masquer {
   display:inline;
}
#afficher:target .afficher {
   display:none;
}
</style>

le code HTML :

   <div id="afficher">
      <div id="masquer">
         <p>
          Léonard de Vinci, né à Vinci le 15 avril 1452 et mort à Amboise le 2 mai 1519, est un peintre florentin et un homme d'esprit universel, à la fois artiste, organisateur de spectacles et de fêtes, scientifique, ingénieur, inventeur, anatomiste, peintre, sculpteur, architecte, urbaniste, botaniste, musicien, poète, philosophe et écrivain. océan de langues.
         </p>
         <p id="divjoconde">
         <img src="http://perso.univ-lille3.fr/~rlecerf/data/images/200px-la_gioconda.jpg">
         </p>
         <p>C'est d'abord comme peintre que Léonard de Vinci est reconnu. Deux de ses œuvres, <a href="#afficher" class="afficher">La Joconde</a><a href="#masquer" class="masquer">La Joconde</a> et La Cène, sont des peintures mondialement célèbres, souvent copiées et parodiées
         </p>
      </div>
   </div>
</body>

Démo : (cliquer sur le mot La Joconde)

Léonard de Vinci, né à Vinci le 15 avril 1452 et mort à Amboise le 2 mai 1519, est un peintre florentin et un homme d'esprit universel, à la fois artiste, organisateur de spectacles et de fêtes, scientifique, ingénieur, inventeur, anatomiste, peintre, sculpteur, architecte, urbaniste, botaniste, musicien, poète, philosophe et écrivain. océan de langues.

La Joconde

C'est d'abord comme peintre que Léonard de Vinci est reconnu. Deux de ses œuvres, La JocondeLa Joconde et La Cène, sont des peintures mondialement célèbres, souvent copiées et parodiées


Recherche

Statistiques

  • 28 articles
  • aucun commentaire
  • PluXml 5.3.1