Discussion :

[PatSan]

J'ai un problème avec la position d'une DIV : elle est déclarée en position 'Fixed'.
A l'affichage de ma page, elle se place exactement où je veux.

Quand je scroll la page (en horizontale ou verticale), le div reste à sa place sur l'écran.
C'est un comportement normal sauf que je veux qu'elle reste à sa place initiale sur ma page !

Comment faire ? Je sais qu'en pur CSS, c'est galère, voire impossible...
Une solution javascript, compatible avec la plupart des navigateur existe-t-elle ?

J'ai déjà essayé avec une position 'relative' par rapport à un conteneur en position 'absolute' mais le positionnement en utilisant la récursivité sur offsetParent ne fonctionne pas très bien car j'ai pas mal d'imbrications de div et de tables...

[Netek]

Normalement tu peux faire ca sans JS avec l'attribut CSS position: absolute;

[PatSan]

position absolute ne résoud pas le problème : quand tu rétrécis ou agrandis la fenêtre, la div ne suit pas sa position initiale (relativement à un autre objet), elle reste fixe...

[witeman]

Pas sûr de bien comprendre ce que tu recherches, mais je tente :
En gros, ce que tu recherches, c'est que ton div garde toujours le même ratio d'espace dans ta page lorsque tu agrandis ou réduis celle ci, et tout en conservant son ancrage dans le visuel (position:fixed) ?

Si c'est ça, il faudra effectivement passer par du JS je crois, avec un appel des dimensions de la fenêtre et tout le touti...

Mais peut-être n'ai-je pas compris ta demande...

[PatSan]

Witeman, tu as exactement mis le doigt dessus : je cherche à ce que l'ancrage soit conservé par rapport à un autre élément et ce, quelque soit la manipulation de la fenêtre : agrandissement, rétrécissement, déplacement,...

[witeman]

"déplacement" ? je ne suis pas sûr de bien comprendre cette dernière manip

Autrement, peut être que ce que tu recherches est tout simplement faisable avec des dimensions relatives (pourcentage) ?
As-tu essayé ?

Un truc du genre dans ton css :

Code :

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

1
2
3
4
5
body
{
width: 100%;
height: 100%
}

et

Code :

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

1
2
3
4
5
6
7
8
#ton_div
{
position: fixed;
top: 100px;
left: 100px;
width: 30%;<!-- valeurs au pif, à toi de voir-->
height: 40%;<!-- valeurs au pif, à toi de voir-->
}

mais cela nécessite surement de revoir la structure de ta page...