div au milieu de l'écran

Version imprimable

28/02/2006, 13h42
crakocrako

div au milieu de l'écran

Bonjour,

J'ai une balise div avec un tableau et j'aimerais qu'elle s'affiche toujours au centre de l'écran même si l'utilisateur descend ou monte dans la fenêtre...
Le problème actuellement est que j'ai une position fixe dans la fenêtre et si l'utilisateur descend dans la fenêtre, il ne voit plus le div...

Merci d'avance si vous pouvez m'aider...
28/02/2006, 13h48
SpaceFrog

modifie le top de ton div sur le onscroll du body ...
ou alors utilises des div container de hauteur 100% sur différents niveaux de z-index ...
28/02/2006, 13h51
crakocrako

merci beaucoup c'est vraiment simpa d'avoir répondu aussi vite...

mais je ne sais pas comment faire pour régler par rapport au onscroll... est-ce que tu peux m'expliquer?

merci
28/02/2006, 14h00
SpaceFrog

comme ça concerne plutot javascript ... rendez vous sur le forum approprié ...

peux tu me donner le code html de ta page avec le div en question ?
28/02/2006, 14h24
crakocrako

Voici le code, j'ai vraiment simplifié parce que j'ai beaucoup d'asp dans la page et elle fait 438 lignes.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body topmargin="0" leftmargin="0">

<div id="fichier_infos" style="border:none; position:absolute; left:285px; top:210px; z-index:1">
//j'ai un tableau dans le div et j'aimerais que le top soit le millieu de la page même si il fait un scroll...
</div>

</body>

Merci pour tout
</html>
28/02/2006, 14h33
SpaceFrog

que le top du tableau soit le mileu de la page ? le milieu du div... j ne comprends pas ta mise en page ??
28/02/2006, 14h46
crakocrako

le problème actuellement est que le top du div est fixé à 210px mais quand je fait un scroll de la fenêtre internet beaucoup plus bas dans la page, le div n'apparait plus car il est à 210px...

Est-ce qu'il n'y a pas une manière que le div reste visible même si on descend dans la page? Je pense que la variable à changer est le top du div mais je ne sais pas comment récupérer la bonne valeur à mettre par rapport à la position de l'utilisteur dans la page...

Désolé si c'est pas trop clair...

Merci

je sais pas si c'est ça que tu veux ...mais ce sera déja un début de réponse:

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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type='text/javascript'>
function staythere(){
document.getElementById('fichier_infos').style.top=document.body.scrollTop+210;
}
 
</script>
 
</head>
 
<body topmargin="0" leftmargin="0" onscroll="staythere()">
 
<div id="fichier_infos" style="border:none; position:absolute; left:285px; top:210px; z-index:1" >
<table border="1" id="montableau" style="top:100px;">
	<tr>
		<td> &nbsp;</td>
	</tr>
</table>
 
</div>
<script type='text/javascript'>
for(i=0; i<100; i++){document.write('Merci pour tout+\<\/br\>')}
</script>
 
</body>
 
</html>

sinon sans javascript :oops:
et avec un rendu de scroll beucoup plus fluide ...

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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
</head>
 
<body topmargin="0" leftmargin="0" style="overflow:hidden;">
 
<div id="fichier_infos" style="border:none; position:absolute; left:285px; top:210px; z-index:3" >
<table border="1" id="montableau" style="top:100px;">
	<tr>
		<td> &nbsp;</td>
	</tr>
</table>
 
</div>
<div style='position:absolute; z-index:1;top:0px;height:100%; overflow:auto; width:100%;'>
<script type='text/javascript'>
for(i=0; i<100; i++){document.write('Merci pour tout+\<\/br\>')}
</script>
</div>
</body>
 
</html>

28/02/2006, 15h11
crakocrako

MERCI C'EST VRAIMENT COOL
ca fonctionne bien merci pour tout, le javascript fonctionne bien, il me manquait juste la partie: ...document.body.scrollTop