Agregando conhecimento…
Essa dica é para quem precisa posicionar um determinado elemento utilizando position:fixed; Para a maioria dos navegadores atuais, basta utilizá-lo e aplicar o posicionamento (top/right/bottom/left) necessário. Entretanto no IE6 apenas isso não basta para que o elemento fique fixo: veja abaixo como deve ficar o CSS/Hack para que funcione:
/*FIXA O BG PRINCIPAL*/ * html,* html body {background-image:url(sua_imagem.jpg);background-attachment:fixed;} /*FIXA UM DETERMINADO ELEMENTO*/ * 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));} |
Agora basta, utilizar estas classes no elemento que deseja fixar e pronto. Eu testei aqui nos navegadores Firefox, IE 6 e no Chrome.
Página para publicar e armazenar conteúdo relacionado a Desenvolvimento Web:
PHP, MySQL, Javascript, JQuery, CSS e as novas tecnologias do momento.
Façam comentários, perguntas e sugestões que ficarei satisfeito por recebê-los.
Shiguenori Junior
Leave a reply