Blog de SEO, Interfaces e Comércio Eletrônico

Como já quebrei my a cabeça pra fazer o position:fixed funcionar no IE6, resolvi postar para que outros não percam tanto tempo fazendo essa Missão Impossível, rs

Vamos lá, se voc6e codificar o CSS assim, ele vai funcionar na maioria dos browsers atuais :

.fixed-top /* position fixed Top */{position:fixed;bottom:auto;top:0px;}
.fixed-bottom /* position fixed Bottom */{position:fixed;bottom:0px;top:auto;}
.fixed-left /* position fixed Left */{position:fixed;right:auto;left:0px;}
.fixed-right /* position fixed right */{position:fixed;right:0px;left:auto;}

Porém, entretanto .. muitas pessoas ainda usam o IE6 e não podemos desprezar estes usuários, afinal, eles também geram tráfego e comprar nossos serviços e produtos.
Para driblar as bugs, faça desse jeito que irá funcionar.

Crie um IE6 Hack, que na verdade é uma réplica da classe CSS, porém só é interpretada pelos IEs qdo iniciada com um simples “*classe”. Se quiser algo somente para o IE6, utilize “_classe”

Vamos ao código:

* html,* html body {background-image:url(about:blank);background-attachment:fixed;}
* html .fixed-top {position:absolute;bottom:auto; top:expression(eval(document.documentElement.scrollTop));}
* html .fixed-right {position:absolute;right:auto; left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)-(parseInt(this.currentStyle.marginRight,10)||0));}
* html .fixed-bottom {position:absolute;bottom:auto; top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
* html .fixed-left {position:absolute;right:auto; left:expression(eval(document.documentElement.scrollLeft));}

Testei aqui e funcionou perfeitamente.

Caso encontrem algum problema d eimplementação ou bug, comments please