Peut-on fixer un Div en bas de la fenetre du navigateur ?

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
Répondre
dj.dom
Gecko
Messages : 88
Inscription : 22 juin 2006, 02:58

Peut-on fixer un Div en bas de la fenetre du navigateur ?

Message par dj.dom »

Bonjour

J'aimerai fixer un Div en bas de la fenetre du navigateur qui lit ma page. (j'ai bien dit "de la fenetre", et pas "de la page")
Je sais comment fixer un Div, je l'ai fait pour mon menu. Mais là ça se complique car sa position doit changer en fonction de la taille du navigateur... :?

Est-ce possible ? Et si c'est possible, comment faire ?

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; FDM)
Benoit
Administrateur
Messages : 4894
Inscription : 19 juil. 2003, 10:59

Message par Benoit »

C'est possible en CSS avec position:fixed, mais ça ne fonctionne pas dans IE6.
♫ Li tens s'en veit, je n'ai riens fais ;
Li tens revient, je ne fais riens. ♪
dj.dom
Gecko
Messages : 88
Inscription : 22 juin 2006, 02:58

Message par dj.dom »

Merci, mais ça c'est juste pour fixer. Je ne cherche pas comment le fixer (car je sais le faire maintenant) mais plutot comment faire en sorte que l'endroit où il est fixé soit toujours le bas de la fenetre du navigateur, quelque soit la taille du navigateur.

J'ai bien une petite idée mais je n'en suis pas sûr, et je ne saurai pas la mettre en oeuvre tout seul :
Il me semble avoir lu à propos d'un évenement java avec un nom du style OnScreenResize. Je pourrai m'en servir. A condition qu'on puisse appeler des variables qui contiennent la largeur et la hauteur de la page, j'attriburai à cet évènement un truc du genre :
div.top = <hauteur de la fenetre> - <hauteur de mon image + 10>
div.left = (<largeur de la fenetre>/2) - (<largeur de mon image>/2)

Vous voyez là où je veux en venir ?

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; FDM)
Nucleos
Lézard à collerette
Messages : 282
Inscription : 04 juil. 2003, 17:04

Message par Nucleos »

Genre pour fixer un div en bas à droite de la fenêtre, il suffit de faire par exemple :

Code : Tout sélectionner

	div { width: 40%; bottom: 1em; background: white; color: pink; position: fixed; right: 1em;  }
Je ne comprends pas bien pourquoi tu dis que cette fonctionnalité-là ne marche pas, enfin sauf si tu veux dire que cela ne marche pas sous Internet Explorer comme l'explique Benoit. J'ai créé un exemple temporaire pour toi.

Je n'ai trouvé aucune mention d'un événement JavaScript qui parle de redimensionnement de la page... Par contre j'ai trouvé un hack pour Internet Explorer qui permet de contourner le fait qu'Internet Explorer ne connaisse pas position: fixed.
« La clarté est la politesse des professeurs. » (E. Gerurez)
... Posons de bonnes questions !
dj.dom
Gecko
Messages : 88
Inscription : 22 juin 2006, 02:58

Message par dj.dom »

:shock: Bah c'est beaucoup plus simple que je croyais...
Merci. :)

Par contre, je ne comprend pas ce qu'est "lem" qui définie Bottom et Right.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; FDM)
epsy
Varan
Messages : 1024
Inscription : 21 déc. 2005, 19:58

Message par epsy »

mets 0px si tu préferes :wink:

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.0.4) Gecko/20060719 Firefox/1.5.0.4
҈ - config- http://fr.enlightenment.org - wikipedia mon amiiii! - JID: epsy arobase :) jaim.at
jpbardiau
Tyrannosaurus Rex
Messages : 2709
Inscription : 05 avr. 2004, 17:34

Message par jpbardiau »

epsy a écrit :mets 0px si tu préferes :wink:
Ce qui revient quasiment au même que 0em.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1
JP
Image
Image
Mongo Bob
Varan
Messages : 1903
Inscription : 10 sept. 2005, 01:51

Message par Mongo Bob »

Par contre, je ne comprend pas ce qu'est "lem" qui définie Bottom et Right.
Pas "lem" : "1 em".
Win:Kpz version 0.7.10 (20070831)
Ubuntu:Kpz v 20090206
2 tutos :
http://josar.free.fr/index.html
http://info.sio2.be/kpz/
1 nécessité :
http://www.geckozone.org/forum/viewtopic.php?t=51228
HP
Tyrannosaurus Rex
Messages : 2196
Inscription : 21 oct. 2004, 10:25

Message par HP »

jpbardiau a écrit :
epsy a écrit :mets 0px si tu préferes :wink:
Ce qui revient quasiment au même que 0em.
de toute façon à 0 me semble qu'il est vraiment facultatif (voire inutile) de préciser une unité :wink:

“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
Nucleos
Lézard à collerette
Messages : 282
Inscription : 04 juil. 2003, 17:04

Message par Nucleos »

dj.dom a écrit :Par contre, je ne comprend pas ce qu'est "lem" qui définie Bottom et Right.
En utilisant une unité non relative au medium d'affichage (typiquement : en utilisant le pixel), tu imposes une norme. Que ce soit dans le cas de très gros écrans ou de très petits, 15 pixels ne correspondent pas à un caractère, alors que sur ton ordi et sur le mien ça doit être à peu près ça.

Bref, il faut te pencher sur le (vieux) problème des tailles absolues et relatives... et ne plus utiliser px que lorsque c'est nécessaire (typiquement : conjointement avec un design réalisé avec des tas d'images.)
« La clarté est la politesse des professeurs. » (E. Gerurez)
... Posons de bonnes questions !
dj.dom
Gecko
Messages : 88
Inscription : 22 juin 2006, 02:58

Message par dj.dom »

Ah ok, donc si j'ai bien compris, 1 em vaut la taille d'un caractère, dont l'équivalent en pixel varie selon les règlages de l'utilisateur. Interressant.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; FDM)
Nucleos
Lézard à collerette
Messages : 282
Inscription : 04 juil. 2003, 17:04

Message par Nucleos »

dj.dom a écrit :Ah ok, donc si j'ai bien compris, 1 em vaut la taille d'un caractère, dont l'équivalent en pixel varie selon les règlages de l'utilisateur. Interressant.
Cf cette belle présentation.
« La clarté est la politesse des professeurs. » (E. Gerurez)
... Posons de bonnes questions !
Invité

Message par Invité »

Je croyais que 1ex="hauteur d'un x" et 1em="largeur d'un M" ?...

Message envoyé avec : Mozilla/8.0 (compatible; MSIE 8.0; Windows NT 6.0)
Bobe
Iguane
Messages : 742
Inscription : 28 juil. 2003, 21:29

Message par Bobe »

jpbardiau a écrit :
epsy a écrit :mets 0px si tu préferes :wink:
Ce qui revient quasiment au même que 0em.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1
Ah non! Pas quasiment, absolument!
0 reste 0, quelque ce soit l’unité qu’on colle derrière. Que ce soit des pixels, des centimètres ou des carottes…
D’ailleurs, la recommandation CSS précise que dans le cas du 0, préciser l’unité derrière n’est pas obligatoire.
« La vie d’un geek est un combat perpétuel contre l’imperfection »
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 6 invités