Chargement calque
Repeater
-
Repeater -
Repeater -
Bonjour,
Les pages de mon site sont construites à l'aide de calques qui apparaissent ou disparaissent lorsque l'on clique sur une image...
Pour cela j'ai utilisé le code suivant :
<script language="JavaScript">
<!--
var tab = new Array('calque1','calque2','calque3');
function showDiv(theDiv) {
for(var i=0; i<tab.length; ++i)
document.getElementById(tab[i]).style.display = 'none';
document.getElementById(theDiv).style.display = 'block';
}
function hideDiv() {
for(var i=0; i<tab.length; ++i)
document.getElementById(tab[i]).style.display = 'none';
}
//-->
</script>
</head>
<body onLoad="hideDiv();return false" //...
/...
<a href="#" onClick="showDiv('calque1');return false">//...
<a href="#" onClick="showDiv('calque2');return false">//...
<a href="#" onClick="showDiv('calque3');return false">//...
<body>
Le problème c'est que lors du chargement des pages on voit apparaitre et disparaitre certains calques(ce qui n'est pas très esthétique!)
Comment faire pour résoudre ce problème ???
Merci
A+
Les pages de mon site sont construites à l'aide de calques qui apparaissent ou disparaissent lorsque l'on clique sur une image...
Pour cela j'ai utilisé le code suivant :
<script language="JavaScript">
<!--
var tab = new Array('calque1','calque2','calque3');
function showDiv(theDiv) {
for(var i=0; i<tab.length; ++i)
document.getElementById(tab[i]).style.display = 'none';
document.getElementById(theDiv).style.display = 'block';
}
function hideDiv() {
for(var i=0; i<tab.length; ++i)
document.getElementById(tab[i]).style.display = 'none';
}
//-->
</script>
</head>
<body onLoad="hideDiv();return false" //...
/...
<a href="#" onClick="showDiv('calque1');return false">//...
<a href="#" onClick="showDiv('calque2');return false">//...
<a href="#" onClick="showDiv('calque3');return false">//...
<body>
Le problème c'est que lors du chargement des pages on voit apparaitre et disparaitre certains calques(ce qui n'est pas très esthétique!)
Comment faire pour résoudre ce problème ???
Merci
A+
5 réponses
dans ta page html, où se situent la définition de tes calques ?
plus ils sont loin dans la page, mieux c'est puisqu'à la fin du chargement html, la première fonction appliquée sera l'événement onLoad et tu cacheras tes calques,
donc plus ils sont bas dans ton code html, mieux c'est je pense
Didier
plus ils sont loin dans la page, mieux c'est puisqu'à la fin du chargement html, la première fonction appliquée sera l'événement onLoad et tu cacheras tes calques,
donc plus ils sont bas dans ton code html, mieux c'est je pense
Didier
J'ai fait ca pour cacher des menus. Avec du css ca marche bien car il n'y a pas de fonction a executer, le style s'affiche directement. Si tes calques sont definis dans des balises <div>, tu peux
<HEAD>
<STYLE type="text/css">
<!--
#calque1, #calque2{
display: none;
}
-->
</STYLE>
</HEAD>
<HEAD>
<STYLE type="text/css">
<!--
#calque1, #calque2{
display: none;
}
-->
</STYLE>
</HEAD>
Salut,
Tout d'abord UN GRAND MERCI A VOUS 2 pour votre aide !!!
Je viens d'essayer tout ça et c'est la solution de kili kili qui a été la bonne.
Par contre je pense avoir un autre problème : c'est que le chargement sur certaines pages risque d'être assez long, donc j'aimerai pouvoir rajouter un calque "Chargemant en cour...", qui s'afficherai seulement pendant le chargement.
Comment dois-je procéder ?
Encore merci et a +
Fred
Tout d'abord UN GRAND MERCI A VOUS 2 pour votre aide !!!
Je viens d'essayer tout ça et c'est la solution de kili kili qui a été la bonne.
Par contre je pense avoir un autre problème : c'est que le chargement sur certaines pages risque d'être assez long, donc j'aimerai pouvoir rajouter un calque "Chargemant en cour...", qui s'afficherai seulement pendant le chargement.
Comment dois-je procéder ?
Encore merci et a +
Fred
Voila un truc telechargé mais non testé, je vais l'installer maintenant.
<HTML>
<HEAD>
<TITLE>DHTML - Chargement d'une page</TITLE>
<STYLE>TD {FONT-FAMILY: arial,helvetica; FONT-SIZE: 10pt}
BODY {BACKGROUND-COLOR: white}
A {COLOR: navy; TEXT-DECORATION: none}
A:hover {COLOR: red}
A:visited:unknown {COLOR: #808080}
DIV {FONT-FAMILY: arial,helvetica; FONT-SIZE: 10pt}
</STYLE>
<SCRIPT>
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
Visit for more great scripts.
This may be used freely as long as this msg is intact!
********************************************************************************/
//Browsercheck
n=document.layers
ie=document.all
//Hides the layer onload
function hideIt(){
if(ie || n){
if(n) document.divLoadCont.visibility="hidden"
else divLoadCont.style.visibility="hidden"
}
}
</SCRIPT>
<STYLE>#divLoadCont {BACKGROUND-COLOR: white; FONT-FAMILY: arial,helvetica; HEIGHT: 95%; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 100%; Z-INDEX: 100; layer-background-color: white}
TD {FONT-FAMILY: arial,helvetica}
</STYLE>
</HEAD>
<BODY onload="setTimeout('hideIt()',1000)">
<SCRIPT>
//We write the table and the div to hide the content out, so older browsers won't see it
if(ie || n) document.write('<div id="divLoadCont"><table width="100%" height="95%" align="center" valign="middle"><tr><td width="100%" height="100%" align="center" valign="middle"><h3>Chargement en cours...</h3></td></tr></table></div>')
</SCRIPT>
Bonjour et bienvenue à tous et à toutes sur PCVTEAM !
<BR>
Le chargement est éffectue ;o)
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>DHTML - Chargement d'une page</TITLE>
<STYLE>TD {FONT-FAMILY: arial,helvetica; FONT-SIZE: 10pt}
BODY {BACKGROUND-COLOR: white}
A {COLOR: navy; TEXT-DECORATION: none}
A:hover {COLOR: red}
A:visited:unknown {COLOR: #808080}
DIV {FONT-FAMILY: arial,helvetica; FONT-SIZE: 10pt}
</STYLE>
<SCRIPT>
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
Visit for more great scripts.
This may be used freely as long as this msg is intact!
********************************************************************************/
//Browsercheck
n=document.layers
ie=document.all
//Hides the layer onload
function hideIt(){
if(ie || n){
if(n) document.divLoadCont.visibility="hidden"
else divLoadCont.style.visibility="hidden"
}
}
</SCRIPT>
<STYLE>#divLoadCont {BACKGROUND-COLOR: white; FONT-FAMILY: arial,helvetica; HEIGHT: 95%; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 100%; Z-INDEX: 100; layer-background-color: white}
TD {FONT-FAMILY: arial,helvetica}
</STYLE>
</HEAD>
<BODY onload="setTimeout('hideIt()',1000)">
<SCRIPT>
//We write the table and the div to hide the content out, so older browsers won't see it
if(ie || n) document.write('<div id="divLoadCont"><table width="100%" height="95%" align="center" valign="middle"><tr><td width="100%" height="100%" align="center" valign="middle"><h3>Chargement en cours...</h3></td></tr></table></div>')
</SCRIPT>
Bonjour et bienvenue à tous et à toutes sur PCVTEAM !
<BR>
Le chargement est éffectue ;o)
</BODY>
</HTML>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question