Afficher remplacer un div par clique d'image

Résolu/Fermé
Signaler
Messages postés
121
Date d'inscription
mardi 28 juillet 2009
Statut
Membre
Dernière intervention
22 janvier 2014
-
Messages postés
121
Date d'inscription
mardi 28 juillet 2009
Statut
Membre
Dernière intervention
22 janvier 2014
-
Bonjour a tous,
je vous expose mon problème. j'ai fait un site internet avec une version non enregistré de Web Creator donc un message apparait a chaque page pour rappeler a tout le monde que je n'ai pas encore acheter le logiciel ... pas cool mais bon compréhensible.
j'ai acheter aujourd'hui WebExpert que je trouve sympa mais avec lequel je doit apprendre pas mal de truc.

donc j'aimerais faire apparaitre un div contenant du texte grâce à un clique sur une image. jusque la rien de très compliqué seulement voila j'aimerais que ce div disparaisse pour laisser place à un autre en cliquant sur une deuxième image.
la ou ca se complique c'est que j'aimerais bien que les deux div apparaissent au même endroit.
je vous donne un lien vers la page existante pour que vous compreniez mieux ce que j'aimerais faire.

http://www.freewebtown.com/avelectricite/pages/normes.html

je vous remercie par avance de votre aide

3 réponses

Messages postés
1481
Date d'inscription
samedi 7 mai 2005
Statut
Membre
Dernière intervention
20 décembre 2014
292
Bonjour,
pas besoin d'acheter un logiciel pour ça, le bloc note aurait suffit.
Si vous voulez afficher un texte différent sans avoir à recharger la page, il faut passer par javascript.
Il existe des tas d'exemples sur le net de galeries en javascript que vous pourrez adapter à votre cas.
Concrètement l'ensemble des textes est present sur la page web mais une partie sera cachée par javascript. C'est le principe des galeries d'images par exemple.

https://www.alsacreations.com/tuto/lire/719-galerie-images-simple-jquery.html
Messages postés
121
Date d'inscription
mardi 28 juillet 2009
Statut
Membre
Dernière intervention
22 janvier 2014
9
merci Rodolphe je vais regarder ca
Messages postés
121
Date d'inscription
mardi 28 juillet 2009
Statut
Membre
Dernière intervention
22 janvier 2014
9
bon ben c'est bon j'ai trouver tout seul au final mais merci quand meme Rodolphe
pour ceux qui cherche aussi je laisse un code

<html>
<head>
<script>
function visibilite(thingId)
{
 var i;
 var targetElement;
 for(i=1; i<=3;i++){
  targetElement = document.getElementById("divid" + i) ;
  targetElement.style.display = "none" ;
 }
 targetElement = document.getElementById("divid" + thingId) ;
 targetElement.style.display = "" ;
}
</script>

<script>
function cacher()
 var i;
 var targetElement;
 for(i=1; i<=3;i++){
  targetElement = document.getElementById("divid" + i) ;
  targetElement.style.display = "none" ;
 }

</script>
</head>
<body>

<a onClick="javascript:visibilite('1');">lien1&nbsp;
<a onClick="javascript:visibilite('2');">lien2&nbsp;
<a onClick="javascript:visibilite('3');">lien3&nbsp;
<div id="divid1" style="display:none;">**** CONTENU LIEN1 *****</div>
<div id="divid2" style="display:none;">**** CONTENU LIEN2 *****</div>
<div id="divid3" style="display:none;">**** CONTENU LIEN3 *****</div>

</body>
</html>