Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1628 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Positionner un div en bas du navigateur

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Positionner un div en bas du navigateur

n°1685221
rufo
Pas me confondre avec Lycos!
Posté le 12-02-2008 à 11:13:05  profilanswer
 

Bonjour,
Je souhaite afficher un div "popup" périodiquement pour afficher qq infos dedans, infos générées dynamiquement provenant d'un BD (c'est juste pour dire que la taille en hauteur du div est variable, en largeur, je l'ai fixée) et obtenues par une requête ajax. j'utilise script.aculo.us pour faire l'effet d'apparition et placer le div sur le côté droit du navigateur mais j'ai un pb pour le placer en hauteur.
En effet, la taille de ma page web est variable et peut s'étendre sur plusieur "écrans" en hauteur (comprendre, l'utilisateur doit scroller verticalement). Ce que je voudrais, c'est que ma div se place toujours en bas de la fenêtre du navigateur web et non pas de la taille de ma page web (afin de faire un effet de "notification", comme si le div provenait de la barre de statut du navigateur).
Sou IE, ça marche bien comme je veux, mais sur firefox, non. Si ma page web fait moins d'1 écran, c'est ok. Si elle fait plus et que l'utilisateur n'a pas scrollé, c'est ok aussi. Mais si elle fait plus et que l'utilisateur a scrollé alors le div va se positionner trop haut et l'utilisateur ne verra pas le div (sauf s'il remonte).
 
Je précise que mon div est bien positionné en absolute et que je l'ai inséré par JS en tant que noeud enfant du body.
 

Code :
  1. #DialogPopupPluginArea {
  2.   width: 150px;
  3.   background: #ebebff;
  4.   border: 1px solid #000084;
  5.   padding-top: 0;
  6.   position: absolute;
  7.   right: 10px;
  8.   bottom: 10px;
  9. }


Message édité par rufo le 12-02-2008 à 11:32:25

---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
mood
Publicité
Posté le 12-02-2008 à 11:13:05  profilanswer
 

n°1685310
ceyquem
E falso sequitur quodlibet
Posté le 12-02-2008 à 13:56:47  profilanswer
 

si je ne m'abuse pour ce type d'alignement tu devras ajouter du javascript à la sauce pour que ça prenne. J'avais fait un script similaire pour centrer une boite au milieu d'un écran lorsqu'on scrolle :
 

Code :
  1. function popupAlignMiddle(){
  2. var boite = document.getElementById('boite');
  3. var newTop = document.body.scrollTop + document.documentElement.scrollTop + (document.body.clientHeight + document.documentElement.clientHeight) / 2;
  4. boite.style.top = newTop + 'px';
  5. }

n°1685491
tpierron
Posté le 12-02-2008 à 18:14:50  profilanswer
 

Euh, sinon il y a aussi l'attribut: "position: fixed", qui se réfère à la fenêtre du navigateur et non au document. En mettant ensuite les attributs right et bottom, ton div sera toujours calé en bas à droite de la fenêtre (quel que soit sa taille).
 
Bon évidemment IE6 vient foutre la merde comme à son habitude. IE7 est correct (Edit: avec un rendu en mode "compliance" évidemment).


Message édité par tpierron le 12-02-2008 à 18:15:53
n°1685864
rufo
Pas me confondre avec Lycos!
Posté le 13-02-2008 à 14:34:12  profilanswer
 

tiens, j'y pensais plus à fixed. Effectivement, ça me paraît pas mal. Je vais tester ça pour FF, sachant que la solution que j'ai faite fonctionne correctement pour IE6.


---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Positionner un div en bas du navigateur

 

Sujets relatifs
Positionner 2 DIV côte à côte et alignés vers le basPb rechargement xml par le navigateur
redirection =f(navigateur)[AS3] Positionner des pieces a l'aide d'un Array
Problème de cache navigateur - iFrameIntégration des touches de fonction sur un navigateur web
creer un jeu en ligne massivement multijoueur dans un navigateurComment positionner un texte au dessus d'une image (CSS)
positionner une variable d'environnement avec DOSChamp de saisie invisible dans navigateur
Plus de sujets relatifs à : Positionner un div en bas du navigateur


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR