Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 218

Fixar DIV no centro e na esquerda

05-04-2012 23:19

Boa noite, estou tentando fixar uma div que sera um menu rápido, mas no IE não funciona. Ja no FF e Chrome ta joia. A intenção é, mesmo que mova a barra de rolagem essa DIV tem que ficar sempre no centro e na esquerda.

Sabe me informar o que tem de errado?

Agradeço a atenção.

CSS
#floating-menu { position:fixed; border:1px solid #999; z-index:100; padding: 5px; background-color: #CCC; } #floating-menu li { padding-bottom: 5px; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #FFF; padding-top: 5px; list-style-type:none; }


DIV
<div id="floating-menu"> <li><a href="#"><img src="images/img_home.png" alt="Início" title="Início"></a></li> <li><a href="#"><img src="images/img_menu.png" alt="Menú" title="Menú"></a></li> <li><a href="#"><img src="images/img_contato.png" alt="Contato" title="Contato"></a></li> <li><a href="#"><img src="images/img_buscar.png" alt="Buscar" title="Buscar"></a></li> </div>

0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17735
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Fixar DIV no centro e na esquerda

06-04-2012 09:54

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 218

Fixar DIV no centro e na esquerda

07-04-2012 12:48

Amigão muito obrigado pela dica. Agora no IE esta justo a esquerda, mas estou com mais um probleminha...rsrs

No FF e Chrome o LI fica justo, agora no IE ele fica com espaço. Poderia me ajudar mais nessa?

Meu codigo.
<style type="text/css"> #floating-menu{ position: fixed; top: 100px; left: 0px; width: 30px; padding: 5px; border:1px solid #999; background-color: #CCC; } * html #floating-menu{ /* IE */ position: absolute; top: expression(body.scrollTop + 100 + "px"); left: expression(body.scrollLeft + 0 + "px"); width: 30px; border:1px solid #999; background-color: #CCC; } #floating-menu li { padding-bottom: 5px; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #FFF; padding-top: 5px; list-style-type: none; padding-left:20px; } </style> <div id="floating-menu"> <li><a href="#"><img src="images/img_home.png" alt="Início" title="Início"></a></li> <li><a href="#"><img src="images/img_menu.png" alt="Menú" title="Menú"></a></li> <li><a href="#"><img src="images/img_contato.png" alt="Contato" title="Contato"></a></li> <li><a href="#"><img src="images/img_buscar.png" alt="Buscar" title="Buscar"></a></li> <li><a href="setidioma.php?idioma=pt">PT</a></li> <li><a href="setidioma.php?idioma=en">EN</a></li> <li><a href="setidioma.php?idioma=es">ES</a></li> </div>

Obrigado.
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17735
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Fixar DIV no centro e na esquerda

07-04-2012 13:12

Esse seu script parece que usa um recurso que serve somente no IE. Dá uma olhada nesse

http://ryanfait.com/position-fixed-ie6/
0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 218

Fixar DIV no centro e na esquerda

07-04-2012 13:23

Fixar eu ja consegui, o que estou falando é do espaço que fica na esquerda.
0
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 218

Fixar DIV no centro e na esquerda

07-04-2012 13:32

Veja uma imagem de como fica.

Imagem
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17735
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Fixar DIV no centro e na esquerda

07-04-2012 14:26

Testa o exemplo que indiquei

<style> * { margin: 0; } html, body { height: 100%; overflow: auto; } .wrapper { position: relative; width: 100%; height: 100%; overflow: auto; } .box { position: fixed; left: 10px; top: 180px; } * html .box { position: absolute; } * html .box{ /* IE */ position: absolute; top: expression(body.scrollTop + 100 + "px"); left: expression(body.scrollLeft + 0 + "px"); } </style> <html> <head> <link rel="stylesheet" href="layout.css" ... /> </head> <body> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <div class="wrapper"> <p>All of your website content should be here.</p> </div> <div class="box"> <p>This box is fixed.</p> </div> </body> </html>

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 218

Fixar DIV no centro e na esquerda

07-04-2012 15:11

Amigo,
Uma pergunta, existe outra forma de fazer isso, mas que não seja tão complicado assim?
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17735
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Fixar DIV no centro e na esquerda

07-04-2012 15:32

Existe com jQuery.
Testa esse exemplo http://www.tuljo.com/web-development/ce ... pup-jquery

Nesse exemplo, seria só você zerar o left, para ficar sempre a esquerda.
0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado