Position fixed et IE6 - Alsacreations

Auteur
blman	# 13 Jul 2007 - 15:19:16
22 Posts	Bonjour, j'ais bien cherché chez notre ami Google, mais je ne trouve pas de réponse à ma question. Donc je vous pose la question à vous, puisqu'il paraitrait que c'est vous les experts la-dedans Donc voila, j'ai une boite div qui s'affiche ou disparait en plein milieu de ma fenetre. Pour cela, je l'ai mis en position fixed pour que si on scroll la fenetre, la boite scroll avec... Aucun souci avec Firefox et IE7. Là où ça se corse, c'est que ce ***** IE6 ne connait pas la position fixed. J'ai donc mis un petit hack qui transforme la position fixed en absolute. Le problème, c'est que suivant le scroll, je n'arrive pas à placer cette boite en hauteur. Elle se place toujours à 10% du haut de ma fenêtre. Donc si je scroll tout en bas et que je fais apparaitre ma boite, je suis obligé de rescroller tout en haut pour la voir. Quelqu'un aurait-il une idée ou une piste pour moi, pour que cette boite soit centré en hauteur (du moins au moment où je l'ouvre, pliz ? Modifié par blman (13 Jul 2007 - 15:20)
22 Posts
Changaco	# 13 Jul 2007 - 15:36:47
951 Posts	Bonjour. Un "overflow: hidden" sur html et body empêchera le défilement. Sinon il y a des scripts JS qui permettent de simuler l'effet du "position: fixed".
951 Posts
rafale29	# 13 Jul 2007 - 15:39:55
102 Posts	Bonjour, pour que la boite soit centrée au moment où tu l'ouvres je pense que le code suivant marchera : div#ta_boite { position:absolute; width:200px; height:200px; left:50%; top:50%; margin-top:-100px; margin-left:-100px; } il faut veiller à ce que le margin-left soit égal à -witdh/2 px et de meme que le margin-top soit égal à -height/2 px j'espère que c'est une solution qui pourra t'aider
102 Posts
blman	# 13 Jul 2007 - 15:40:24
22 Posts	Aurais-tu des liens pour des codes qui simulent la position fixed ? Ceux que j'ai trouvé prenait beaucoup de ressource machine, voir faisait planté le PC PS : parce que je ne veux pas interdire le scroll...
22 Posts
blman	# 13 Jul 2007 - 15:56:25
22 Posts	Rafale29, voici mon code : Code mon CSS : div#CalqFicheOn{ display:none; left:50%; margin-left:-300px; top:10%; position: fixed; width:600px; height:400px; background-color:#ffffff; z-index:101; border:2px solid #ff6d06; / IE / position: expression(IEFixedElementPos()); / on tient compte des 25% definis plus haut / /top: expression(IEFixedElementTop(parseInt(document.body.clientHeight 10/100)));/ /top: expression(IEFixedElementTop(parseInt(document.body.clientHeight * 10/100)));/ /left: expression(IEFixedElementLeft(parseInt(document.body.clientWidth * 25/100)));*/ } Code du hack en JS (que j'ai choper je sais plus où) function IEFixedElementPos() { // IE 7 en mode standard if (window.ActiveXObject && window.XMLHttpRequest && window.external && document.compatMode=="CSS1Compat") { return ("fixed"); } return ("absolute"); } function IEFixedElementTop(defaultTop) { // IE 7 en mode standard if (window.ActiveXObject && window.XMLHttpRequest && window.external && document.compatMode=="CSS1Compat") { return (defaultTop.toString() + "px;") } return ((document.body.scrollTop+defaultTop) + "px"); } Donc, à priori, j'utilisais déjà ta solution... Pfff, je sais plus là....
22 Posts
blman	# 13 Jul 2007 - 17:59:19
22 Posts	Est-ce que top et left doivent uniquement prendre des valeurs en pixel sous IE6 ou est-ce qu'on peut lui donner une valeur en % ?
22 Posts
blman	# 13 Jul 2007 - 18:14:16
22 Posts	Peut-être une réponse à ma question ici : http://www.amaryllidaceae.org/web-jardin/CSS/IE-fixed.htm
22 Posts
Shinuza	# 13 Jul 2007 - 19:48:30
210 Posts	Salut, C'est gore comme technique, il suffit de modifier une propriété layout de l'élement pour rafraichir son état, par exemple le z-index pendant le scroll. Concours javascript
210 Posts
chmel	# 15 Jul 2007 - 00:28:57
654 Posts	Bonjour, Si tu l'écris comme ça, sans faire de hack, ce n'est plus gore : <!--[if lte IE 6]> <style type="text/css"> body { background: url(null) fixed ; }/* évite le sautillement */ #id_du_div{position: absolute;top:expression(documentElement.scrollTop+body.scrollTop); </style> <![endif ]--> En réel , dans un fichier externe c'est mieux.
654 Posts
blman	# 17 Jul 2007 - 20:23:40
22 Posts	Merci à tous , j'ai effectivement réussi à faire ce que je voulais grâce aux commentaires conditionnels
22 Posts