Cacher des DIV petit soucis
Bonjour a tous !
Comment allez vous ?
Moi ca va un peu mais je me tire les cheveux avec Javascript.
Je vous explique, je cache des DIV et je les affiches mais le problèmes c'est que je voudrais que quand je veux afficher une DIV toutes les autres se cache alors voilà mon script actuel:
Code javascript:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
<script type="text/javascript">
/*
* Montre / Cache un div
*/
function DivStatus( nom, numero )
{
var divID = nom + numero;
if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
{
Pdiv = document.getElementById( divID );
PcH = true;
}
else if ( document.all && document.all[ divID ] ) // Pour les veilles versions
{
Pdiv = document.all[ divID ];
PcH = true;
}
else if ( document.layers && document.layers[ divID ] ) // Pour les très veilles versions
{
Pdiv = document.layers[ divID ];
PcH = true;
}
else
{
PcH = false;
}
if ( PcH )
{
Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
}
}
/*
* Cache tous les divs ayant le même préfixe
*/
function CacheTout( nom )
{
var NumDiv = 1;
if ( document.getElementById ) // Pour les navigateurs récents
{
while ( document.getElementById( nom + NumDiv) )
{
SetDiv = document.getElementById( nom + NumDiv );
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.all ) // Pour les veilles versions
{
while ( document.all[ nom + NumDiv ] )
{
SetDiv = document.all[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
else if ( document.layers ) // Pour les très veilles versions
{
while ( document.layers[ nom + NumDiv ] )
{
SetDiv = document.layers[ nom + NumDiv ];
if ( SetDiv && SetDiv.className != 'cachediv' )
{
DivStatus( nom, NumDiv );
}
NumDiv++;
}
}
}
</script> |
Code Html:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<div class="ag9">
<a href="javascript:DivStatus( 'mondiv', '1' )"><img src="images/agimgpsd_09.jpg" class="image9" /></a>
</div>
<div class="image10">
</div>
<div id="texte">
<div class="image11">
<div name="mondiv2" id="mondiv2" class="cachediv">
TEXTE CACHER AU DEBUT ET AFFICHER APRES
</div>
</div>
</div> |
Code CSS:
Code:
1
2
3
4
5
6
7
8
|
.cachediv {
visibility: hidden;
overflow: hidden;
height: 1px;
margin-top: -1px;
position: absolute;
} |
Voilà mes codes sources.
Merci bien a plus tard
Pour répondre à ta question...
Oui on peut cacher toute les autres div avant d'en afficher une nouvelle ...
Sans me calquer sur ta source , voici un petit exemple très simple
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
--- Javascript ---
function masqueAutreDiv(obj) {
var myParent = obj.parentNode;
listDiv = myParent.getElementsByTagName('DIV');
for(var i = 0 ; i < listDiv.length; i++){
listDiv[i].style.visibility = 'hidden';
}
obj.style.visibility = 'visible';
}
--- Javascript ---
--- Coté html ---
<div>
<div onclick="masqueAutreDiv(this)">Première</div>
<div onclick="masqueAutreDiv(this)">Deuxieme</div>
<div onclick="masqueAutreDiv(this)">Troisième</div>
<div onclick="masqueAutreDiv(this)">Quatrième</div>
</div>
--- Coté html --- |
Explication :
Je passe en paramètre , l'objet que je veux garder afficher , après je parcours tout le contenant, en récupèrant tous les éléments de type "div" , je les masques toute , PUIS je réaffiche celle sur laquelle j'ai cliqué.
Si tu connais le nombre d'élément tu peux utiliser une boucle lié à tes id.
Coordialement
