Afficher et masquer calque avec js [Résolu]

Signaler
Messages postés
44
Date d'inscription
dimanche 9 novembre 2003
Statut
Membre
Dernière intervention
9 décembre 2008
-
Messages postés
2
Date d'inscription
mardi 30 mars 2010
Statut
Membre
Dernière intervention
24 août 2010
-
Bonjours, j'ai un petit problème avec code:  

<html>
<head>
<title>Document sans-titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function visibilite(thingId)
{
var targetElement;
targetElement = document.getElementById(thingId) ;
if (targetElement.style.display == "none" )
{
targetElement.style.display = "" ;
} else {
targetElement.style.display = "none" ;
}
}
</script>
</head>
 

 
[javascript:visibilite('divid'); afficher/masquer]
[javascript:visibilite('divid2'); afficher/masquer 2]
 

contenu

contenu defaut

</html>

Ce que je cherche à faire, c'est que lorsqu'un div est affiché, j'aimerai que les autre soit caché. Ne pas avoir 2 div supperposé lorsque les 2 liens sont actifs

7 réponses

Messages postés
1251
Date d'inscription
mercredi 7 août 2002
Statut
Modérateur
Dernière intervention
10 avril 2013

Ceci devrait t'aider !

<html>
<head>
<title>Document sans-titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function visibilite(thingId)
{
 var i;
 var targetElement;
 for(i=1; i<4; i++){
  targetElement = document.getElementById("divid" + i) ;
  targetElement.style.display = "none" ;
 }
 targetElement = document.getElementById("divid" + thingId) ;
 targetElement.style.display = "" ;
}
</script>


</head>
 

 
[javascript:visibilite('1'); afficher1/masquer]
[javascript:visibilite('2'); afficher2/masquer]
[javascript:visibilite('3'); afficher3/masquer]
 

contenu 1

contenu defaut

contenu 3

</html>

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Messages postés
44
Date d'inscription
dimanche 9 novembre 2003
Statut
Membre
Dernière intervention
9 décembre 2008

Merci beaucoup  nickadele
Messages postés
2
Date d'inscription
dimanche 26 février 2006
Statut
Membre
Dernière intervention
11 mars 2008

merci pour ton code. il m'a été d'une grande utilité.
J'aimerais mettre ton pseudo sur mon code source si tu permets et si ce code est vraiment de toi...

cpg
Messages postés
1
Date d'inscription
mardi 1 avril 2008
Statut
Membre
Dernière intervention
1 avril 2008

Bonjour,

J'ai fait une page (page1) où en passant sur des liens différents div s'affiche comme expliqué ci-dessus. Je voudrais pouvoir faire un lien depuis une autre page (page 2) vers cette page en choisissant le div qui va s'afficher en fonction du lien. En gros, je veux faire par exemple 4 liens sur la page 2 menant à la page 1 avec le lien 1 qui permet d'afficher le div1, le lien 2 qui permet d'afficher le div2, etc.

Quelqu'un aurait une solution ?

Merci
Messages postés
20
Date d'inscription
samedi 20 septembre 2003
Statut
Membre
Dernière intervention
14 août 2008

Bonjour et merci à Nickadele pour ce script simple super pratique !
Pour ton probleme FOVOIR (il est un peu tard, je suppose que tu as trouvé depuis le temps) mais il faut passer en variable PHP dans tes liens de la page 2, l'id de la div à afficher par défaut :
<?php echo "lien_vers_ma_page1.php?div=1"; ?>
<?php echo "lien_vers_ma_page1.php?div=2"; ?>
etc pour la page deux, trois, quatre...
Variable que tu récupères dans ton body onload sur la page cible :
')">

Warning : il faut se méfier des simples quotes et doubles quotes quand on met des balises PHP dans JS mais j'appelle dynamiquement des FLV et des MP3 via ce principe et en bricolant les simples et doubles quotes, ça fonctionne très bien.

Be Good...
Messages postés
20
Date d'inscription
samedi 20 septembre 2003
Statut
Membre
Dernière intervention
14 août 2008

Tiens, tout sur la meme page, plus simple à comprendre (du coup, je vais m'en servir aussi). Trop de balises PHP dans ma page mais j'ai fait ça vite pour voir si je ne disais pas de betises :-) Et apparemment, ça fonctionne.

<?php
switch($action)
{
case "clicsurdiv";
?>
<html>
<head>
<title>menu div test div n°<?php echo "$div"; ?> affichées</title>
<meta http-equiv= "Content-Type" content="text/html; charset=iso-8859-1">
<script>
function visibilite(thingId)
{
 var i;
 var targetElement;
 for(i=1; i<4; i++){
  targetElement = document.getElementById("divid" + i) ;
  targetElement.style.display = "none" ;
 }
 targetElement = document.getElementById("divid" + thingId) ;
 targetElement.style.display = "" ;
}
</script>


</head>
 
')">
 
[javascript:visibilite('1'); afficher1/masquer]
[javascript:visibilite('2'); afficher2/masquer]
[javascript:visibilite('3'); afficher3/masquer]
 

vous avez cliqué le DIV 1

vous avez cliqué le DIV 2

vous avez cliqué le DIV 3

</html>
<?php
break;


default:
?>
<html>
<head>
<title>menu div test liens source</title>
<meta http-equiv ="Content-Type" content="text/html; charset=iso-8859-1">
<?php echo "Lien vers div 1"; ?>

<?php echo "Lien vers div 2"; ?>

<?php echo "Lien vers div 3"; ?>

</html>
<?php } ?>

Be Good...
Messages postés
2
Date d'inscription
mardi 30 mars 2010
Statut
Membre
Dernière intervention
24 août 2010

slt tous me monde mais ça ne marche pa tamethode Krma, c la deuxiéme page qui doit affiché les div choisi au préalable qui beug et voici l'erreur
"Parse error: syntax error, unexpected $end in /www/zxq.net/e/r/e/erei-dz/htdocs/ppp.php on line 38 "
ça ne marche pas
si je comprend bien il faut faire deux page separées depuis votre derniers code et merci!!!
ilyessou_31