[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, 10h40
identifiant_bidon

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

Voici mon problème. Je dispose d'un tableau de données. Ce tableau contient beaucoup de lignes et j'ai un lien "afficher" dans chaque ligne.

Je veux afficher un élément par clic sur ce lien. Le hic c'est que cet élément, je voudrais l'afficher au centre de ma page. Pour l'instant, avec ce code, je l'affiche toujours au même endroit. Ce qui fait que si je me trouve en bas du tableau, l'element affiché n'est pas visibkle puisqu'il est affiché en haut:
Code:

1 2 document.getElementById('lien_liste_noire').style.left = (document.body.offsetWidth-200)/2; document.getElementById('lien_liste_noire').style.top = (document.body.offsetHeight-180)/2;
Voila, j'espère avoir été assez clair. Merci
30/05/2008, 10h42
SpaceFrog

scrollTo ?
scrollTop
scrollLeft ...
30/05/2008, 10h45
le_chomeur

position fixed en css ??

Code:

1
2
3
document.getElementById('lien_liste_noire').style.position="fixed";
document.getElementById('lien_liste_noire').style.left = (document.body.offsetWidth-200)/2;
	document.getElementById('lien_liste_noire').style.top = (document.body.offsetHeight-180)/2;

Et avec un positinnement "fixed" ca ne fonctionne pas?

Edit: too late

30/05/2008, 10h54
le_chomeur

sinon créer une méthode récupérant le contenu , et tu l'affiche dans une div au centre ( en fixed ;) )
30/05/2008, 10h56
identifiant_bidon

Avec le dernier code donné, j'ai mon élément qui est affiché mais tout en bas de mon tableau. ( Je parle du code de Tussssss)

Tiens je vais essayer avec ScrollTo, scrollTop, et scrollLeft proposées par SpaceFrog
30/05/2008, 11h07
tusssss

Citation:

Envoyé par identifiant_bidon

Avec le dernier code donné, j'ai mon élément qui est affiché mais tout en bas de mon tableau. ( Je parle du code de Tussssss)

Tiens je vais essayer avec ScrollTo, scrollTop, et scrollLeft proposées par SpaceFrog

Avec mon code, il faut surement que tu redéfinisses ta distance top et ta distance left. J'ai repris les tiennes en copier/coller
30/05/2008, 11h48
le_chomeur

bon ... et ma solution ?

Ben c'est précisément ce que je fais en fait.

Voici l'element que j'affiche (avec un style.visibility a visible)

Code:

1
2
3
<div id='lien_liste_noire' style='border:0px; background-color:transparent; width:330; height:180; position:absolute; visibility:hidden;left:0;top:0;'>
					<Iframe id='frame_liste_noire' ALLOWTRANSPARENCY='true' width='100%' height='95%' scrolling='no' name='frame_liste_noire' frameborder='0' src=''></Iframe>
				</div>

30/05/2008, 12h25
identifiant_bidon

Et meme en mettant

Code:

style='border:0px; background-color:transparent; width:330; height:180; position:fixed;

Ca me met mon element tout en bas de page
30/05/2008, 13h22
SpaceFrog

Code:

position: absolute
30/05/2008, 13h41
le_chomeur

bon ... j'dois sentir le poisson aujourd'hui ...
30/05/2008, 13h43
tusssss

Citation:

Envoyé par le_chomeur

bon ... j'dois sentir le poisson aujourd'hui ...

Maintenant que tu le dis :lol:
30/05/2008, 13h46
identifiant_bidon

Ben je t'ai répondu le_chomeur ;) mais aucune de vos solutions ne marche malheureusement .. :cry:
30/05/2008, 14h02
le_chomeur

le parent de la div doit être en position relative , OU
ta div doit être directement dans le document.
autre point , si tu veux centrer ta div verticalement tu dois récupérer sa hauteur en fonction du contenu ...
30/05/2008, 14h10
SpaceFrog

ha j'avais pas compris ça dans ce sens là ...
je pensais qu'il fallait scroller la page de façon à centrer un élement et pas positionner l'élement au centre de la page quelque soit la position des scrollbars ...
30/05/2008, 15h01
identifiant_bidon

Ben ce qui est le plus agaçant c'est que j'ai l'impression que je fais deja tous ces trucs mais ca marche tout de meme pas ....
30/05/2008, 15h03
identifiant_bidon

Citation:

Envoyé par SpaceFrog

ha j'avais pas compris ça dans ce sens là ...
je pensais qu'il fallait scroller la page de façon à centrer un élement et pas positionner l'élement au centre de la page quelque soit la position des scrollbars ...

oui c'est plutot ca que je voulais mais toujours pas de soluce ....
30/05/2008, 15h19
SpaceFrog

ben avec scrollTo() ou le en fixant le scrollTop et scrollLeft de la page ...

en calculant le screen.heigh
le obj.offsetHeight

et du coup il faut scroller le body
obj.offsetTop +(screen.height-obj.offsetHeight)/2

pour le centrage en hauteur et pareil pour le centrage en largeur ...

Euh ouais j'ai pas tout bien compris mais apparemment ma première façon de faire est pas top. Je ne peux plus utiliser un truc du genre ?? :

Code:

1
2
	document.getElementById('lien_liste_noire').style.left = (document.body.offsetWidth-200)/2;
	document.getElementById('lien_liste_noire').style.top = (document.body.offsetHeight-180)/2;

ou ligne_liste_noire est l'id du div que j'affiche

Code:

1
2
3
<div id='lien_liste_noire' style='border:0px; background-color:transparent; width:330; height:180; position:absolute; visibility:hidden;left:0;top:0;'>
     <Iframe id='frame_liste_noire' ALLOWTRANSPARENCY='true' width='100%' height='95%' scrolling='no' name='frame_liste_noire' frameborder='0' src=''></Iframe>
</div>

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