[POO] Placer un objet au centre de l'ecran meme avec scrollbar

Version imprimable

Voir 40 message(s) de cette discussion en une page

30/05/2008, 15h29
le_chomeur

et pourquoi pas une position fixed ?????
30/05/2008, 15h33
SpaceFrog

c'est crossbrowser ça ? :?
30/05/2008, 15h44
le_chomeur

oui ie6 /7 / FF /SAFARI & co ^^
voir contribution des css ;)
30/05/2008, 15h48
SpaceFrog

mais à priori ça ne répond pas à son attente ???
enfin d'après ce que j'ai compris, il ne cherche pas une div flottant, mais juste à centrer le div dans l'écran
30/05/2008, 15h50
identifiant_bidon

C'est désespérant, j'ai essayé avec position a fixed mais la div s'affiche toujours tout en bas de ma page
30/05/2008, 15h52
identifiant_bidon

Citation:

Envoyé par SpaceFrog

mais à priori ça ne répond pas à son attente ???
enfin d'après ce que j'ai compris, il ne cherche pas une div flottant, mais juste à centrer le div dans l'écran

oui c'est tout ce que je veux
30/05/2008, 15h55
le_chomeur

heu oui mais qu'elle soit tout le temps centrée ?
donc fixed répond a la problématique ....

de plus si ton objet apparait tout en bas , cela veut dire qu'il est a l'intérieur d'un élément qui lui n'a pas les bonne propriété , montre nous le code complet :)
30/05/2008, 16h06
tusssss

Citation:

Envoyé par le_chomeur

heu oui mais qu'elle soit tout le temps centrée ?
donc fixed répond a la problématique ....

de plus si ton objet apparait tout en bas , cela veut dire qu'il est a l'intérieur d'un élément qui lui n'a pas les bonne propriété , montre nous le code complet :)

Si quelque soit la méthode utilisée, le div apparait en bas, en effet, l'erreur doit surement venir du div conteneur de celui-ci.
30/05/2008, 16h17
SpaceFrog

qu'entends tu par en bas de page ??? les scrollbars sont à fond en bas et le div est collé au bas de la page ou il y a encore du scroll vertical en dessous ?
30/05/2008, 16h18
le_chomeur

haaa j'me sens moins seul d'un tout d'un seul :yaisse2::yaisse2:

peut être un début d'eclaircissement :

Code:

1
2
3
4
5
<body style="height:2000;width:2000;overflow:auto">
 
<div style="position:absolute;top:1000;left:1000;width:200;height:200;background-color:red">&nbsp;</div>
 
</body>

et du coup il faut mettre un div fake en bas à gauche:

Code:

1
2
3
4
5
6
<body style="height:2000;width:2000;overflow:auto">
 
<div style="position:absolute;top:1000px;left:1000px;width:200;height:200;background-color:red">&nbsp;</div>
<div style="position:absolute;top:2000;left:2000;width:1px;height:1px;">&nbsp;</div>
 
</body>

29/10/2008, 19h01
cyrilskof

Ptite question

Ayant le même problème, je suis trés proche de la réponse, il me manque juste une donnée :
Comment obtenir le scrollTop du navigateur ?

Je m'explique : lorsqu'on scroll une page web vers le bas, il y a une valeur de scroll ( par exemple : 500 px du haut du document).

J'ai essayé avec la fonction :
document.scrollTop ou encore document.body.scrollTop mais ça ne fonctionne pas.

Une idée???

Début de solution

Bon voilà, aprés de nombreuses recherches je suis arrivé à faire quelquechose qui fonctionne assez correctement :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
 var largeur = 800; // largeur du div a afficher
     var hauteur = 600;	 // hauteur du div
	 var top=0; // initialisation
 
		if (navigator.appName == "Microsoft Internet Explorer") // si c'est MIE 
                {
                top=((screen.availHeight-  hauteur)/2) +document.body['scrollTop']; // on calcul la marge du haut : 
				}
            else
                {				
				top=((screen.availHeight-hauteur)/2)+window.pageYOffset;  /// autre methode pour ! de IE
                }
var left=(screen.width-largeur)/2; /// marge gauche
 
cadre.set('margin-top', top); /// on affect le style à l'element souhaité (div)
		cadre.set('margin-left', left);

Voilà j'espère que ça pourra en aider certains.

Au fait pour le css :

Code:

1
2
position: absolute;
z-index:200;

++:king:

29/10/2008, 20h40
Sub0

Salut! ;)

Je n'ai pas lu le sujet en entier, je ne sais pas si votre problème est maintenant résolu...
J'ai réalisé ceci sous Firefox si ça peut vous aider (sait-on jamais) :

http://sub0.developpez.com/html/popup.htm

A+

Voir 40 message(s) de cette discussion en une page