div au milieu de l'écran

**crakocrako** · 28/02/2006, 13h42

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...

**SpaceFrog** · 28/02/2006, 13h48

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 ...

**crakocrako** · 28/02/2006, 13h51

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

**SpaceFrog** · 28/02/2006, 14h00

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 ?

**crakocrako** · 28/02/2006, 14h24

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>

**SpaceFrog** · 28/02/2006, 14h33

que le top du tableau soit le mileu de la page ? le milieu du div... j ne comprends pas ta mise en page ??

**crakocrako** · 28/02/2006, 14h46

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

**SpaceFrog** · 28/02/2006, 14h51

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

**SpaceFrog** · 28/02/2006, 14h54

sinon sans javascript

et avec un rendu de scroll beucoup plus fluide ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

**crakocrako** · 28/02/2006, 15h11

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

div au milieu de l'écran

JavaScript

Discussions similaires

Partager

Partager