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: 383
Sexo: Masculino
Localização: VOLTA REDONDA RJ
Contato:

Menu com submenu IE ok , FF não ...

19-04-2010 20:04

Beleza Grandes da Web.
To fazendo um menu com submenu que ta funcionando no IE ( menos o 8 , só em compatibilidade ) mas no FF não acontece nada ..... não aparece o submenu .

html
<script type="text/javascript"> startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("dropdow"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace (" over", ""); } } } } } window.onload=startList; </script> <div class="row-1"> <div class="wrapper"> <div class="col-1"> <!-- box1 begin --> <div class="box1"> <ul class="dropdow"> <li> <h3>menu 1</h3> <ul class="list1"> <li><a href="#">sub menu 1</a></li> <li><a href="#">sub menu 1</a></li> <li><a href="#">sub menu 1</a></li> </ul> </li> </ul> </div> <!-- box1 end --> </div> <div class="col-2"> <!-- box2 begin --> <div class="box2"> <ul class="dropdow"> <li> <h3>menu 2</h3> <ul class="list1"> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> </ul> </li> </ul> </div> <!-- box2 end --> </div> <div class="col-3"> <!-- box3 begin --> <div class="box3"> <ul class="dropdow"> <li> <h3>menu 3</h3> <ul class="list1"> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> </ul> </li> </ul> </div> <!-- box3 end --> </div> </div> </div>

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

Menu com submenu IE ok , FF não ...

19-04-2010 20:12

Aqui no fórum tem 1 menu nesse estilo funcionando, faz uma busca.
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 383
Sexo: Masculino
Localização: VOLTA REDONDA RJ
Contato:

Menu com submenu IE ok , FF não ...

19-04-2010 20:12

Perdão ... deu erro aqui e não foi completo ...

To fazendo um menu com submenu que ta funcionando no IE ( menos o 8 , só em compatibilidade ) mas no FF não acontece nada ..... não aparece o submenu .

<script type="text/javascript"> startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("dropdow"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace (" over", ""); } } } } } window.onload=startList; </script> <div class="row-1"> <div class="wrapper"> <div class="col-1"> <!-- box1 begin --> <div class="box1"> <ul class="dropdow"> <li> <h3>menu 1</h3> <ul class="list1"> <li><a href="#">sub menu 1</a></li> <li><a href="#">sub menu 1</a></li> <li><a href="#">sub menu 1</a></li> </ul> </li> </ul> </div> <!-- box1 end --> </div> <div class="col-2"> <!-- box2 begin --> <div class="box2"> <ul class="dropdow"> <li> <h3>menu 2</h3> <ul class="list1"> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 2</a></li> </ul> </li> </ul> </div> <!-- box2 end --> </div> <div class="col-3"> <!-- box3 begin --> <div class="box3"> <ul class="dropdow"> <li> <h3>menu 3</h3> <ul class="list1"> <li><a href="#">sub menu 3</a></li> <li><a href="#">sub menu 3</a></li> <li><a href="#">sub menu 3</a></li> </ul> </li> </ul> </div> <!-- box3 end --> </div> </div> </div>

css
/*==================boxe1====================*/ .box1 ul { margin: 0; padding:0; list-style: none; width: 299px; background:#538a04; } .box1 ul li { position: relative; } .box1 li ul { position: absolute; left: 0; top: 44px; display: none; background:url(images/box1-bg.gif) left top repeat-x #9ed41c; min-height:193px; height:auto !important; height:193px; } .box1 ul li a { display: block; text-decoration: none; color: #FFF; padding:10px 15px 0px 20px; } .box1 li:hover ul, li.over ul { display: block; } /* Fix IE. Hide from IE Mac \*/ * html ul li { float: left; height: 1%; } * html ul li a { height: 1%; } /* End */

Para os box2 e box3 no css muda de box1 para 2 e 3 ... não completei para não ficar muito grande ...
row-1 e col-1 2 e 3 são questões de layout ( tamanho e posicionamento )
Coloquei em box diferentes pois as cores são diferentes .

O que acontece é que os submenus não aparecem no FF e IE8 , só IE7 e ou inferior .....

Mais uma vez desculpa pela postagem dupla.
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17246
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Menu com submenu IE ok , FF não ...

19-04-2010 20:37

Esse menu está bugado em ambos navegadores. Como já indiquei, procura aqui no fórum por: menu submenu
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 383
Sexo: Masculino
Localização: VOLTA REDONDA RJ
Contato:

Menu com submenu IE ok , FF não ...

03-05-2010 21:58

Funcionando perfeitamente desta forma :

jquery
<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("dropdow"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="li") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace (" over", ""); } } } } } window.onload=startList; </script> <script type="text/javascript"> var home = "pagina.html" $(function(){ navegar(home) atribuir() }) atribuir = function() { $("ul.list1 li a").click(function(){ navegar($(this).attr("href")) return false }) } navegar = function(pagina) { $("#conteudo").load(pagina) } </script>

html
<div class="box1"> <ul class="dropdow"> <li> <h3>Titulo</h3> <ul class="list1"> <li><a href="pagina.html">pagina</a></li> <li><a href="pagina1.html">pagina1</a></li> <li><a href="pagina2.html">pagina2</a></li> <li><a href="pagina3.html">pagina3</a></li> </ul> </li> </ul> </div>

CSS
.box1 ul { margin: 0; padding:0; list-style: none; width: 299px; background:#538a04; } .box1 ul li { position: relative; } .box1 li ul { position: absolute; left: 0; top: 44px; display: none; background:url(images/box1-bg.gif) left top repeat-x #9ed41c; min-height:150px; height:auto !important; height:150px; } .box1 ul li a { display: block; text-decoration: none; font-size:1.15em; color: #FFF; padding:10px 15px 0px 20px; } .box1 ul li a:hover { display: block; text-decoration: none; font-size:1.15em; color: #033; padding:10px 15px 0px 20px; } .box1 li:hover ul, li.over ul { display: block; } /* Fix IE. Hide from IE Mac \*/ * html ul li { float: left; height: 1%; } * html ul li a { height: 1%; } /* End */

0

Quem está online

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