Menu com sub Menu - ajuda no script

ricardofariasc · Maio 20, 2011

Bom dia a todos!

Fiz um menu vertical ( http://www.fematelferragens.com.br ) mas estou com um problema nele.

Quero que quando o cliente clique no menu, abra o submenu e fique aberto depois de clicar no item que ele quer vizualizar.

Agora ele abre a página e fecha o submenu, então tem que abrir de novo o menu para aparecer os submenus.

alguém poderia me ajudar ? Abaixo o codigo.

<html>
<head>
    <title>menu</title>
    
    <!--|||||=========== COLOQUE ENTRE AS TAGS HEAD ==========|||||||||| -->
    
    <!-- ||**||**||**||  FOLHA DE ESTILOS (CSS) ||**||**||**|| -->
    <style type="text/css">    
    /*+++++++++++++++ RELATIVO AS CATEGORIAS +++++++++++++++++++++*/
    
    /**** LINKS DOS NOMES DAS CATEGORIAS ****/
    /* Link em estado natural*/
    a.link_menu:link{color:#000000;text-decoration:none;font-weight:bold;font-family:arial;font-size:11px}
    /* Link depois de visitado*/
    a.link_menu:visited{color:#000000;text-decoration:none;font-weight:normal;font-family:arial;font-size:11px}
    /* Link ao passar o mouse*/
    a.link_menu:hover{color:#000000;text-decoration:underline;font-weight:bold;font-family:arial;font-size:11px}
    /**** FIM LINKS DOS NOMES DAS CATEGORIAS ****/
    
    /**** CELULAS DOS NOMES DAS CATEGORIAS ****/
    /*padding top right bottom left */
    .titulo_menu{       
       background-color:#cccccc;
        background-image:url(none);
        width:150px;
        height:25px;
        border:1px solid black;
        padding: 5px 0px 0px 5px;
    }
    /**** FIM CELULAS DOS NOMES DAS CATEGORIAS ****/
    
    /*++++++++++++ FIM RELATIVO AS CATEGORIAS +++++++++++++++++++++*/        
    
    
    
    /*++++++++++++  RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/
    
    /**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
    /* Link em estado natural*/
    a.link_smenu:link{color:#000000;text-decoration:none;font-weight:normal;font-family:arial;font-size:10px}
    /* Link depois de visitado*/
    a.link_smenu:visited{color:#000000;text-decoration:none;font-weight:normal;font-family:arial;font-size:10px}
    /* Link ao passar o mouse*/
    a.link_smenu:hover{color:#000000;text-decoration:underline;font-weight:bold;font-family:arial;font-size:10px}
    /**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
        
    /**** CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
    /*padding top right bottom left */
    .itens_menu{
       background-color:#cccccc;
        background-image:url(none);
        width:137px;
        height:25px;
        border:1px solid brack;
        padding: 5px 0px 0px 5px;
    }    
    /**** FIM CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
    
    /**** CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
    .itens_menu_r{
       background-color:#cccccc;
        background-image:url(none);
        width:137px;
        height:25px;
        border:1px solid black;
        padding: 5px 0px 0px 5px;        
    }    
    /**** FIM CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
    
    /*++++++++++++ FIM RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/    
    </style>    
    <!-- ||**||**||** FIM FOLHA DE ESTILOS (CSS) ||**||**||** -->
    
    <!-- |||||||||||||||| FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->
    &lt;script language="javascript">
       c=0
        du="";
       function escondediv(dv,n){        
            
           for(i=1;i<=n;i++){            
               if(i==dv ){
                   if(du!=dv){
                      document.getElementById('mdiv'+i).style.display="inline"
                       du=dv
                    }else{
                       du=""
                       document.getElementById('mdiv'+i).style.display="inline"
                    }
               }else{
                     document.getElementById('mdiv'+i).style.display="none"                                      
               }                
                
            }        
        }
        
    function reveza(qualquer){
      document.getElementById(qualquer).className="itens_menu_r"
    }
    function volta(qualquer){
      document.getElementById(qualquer).className="itens_menu"
    }
    </script>
    <!-- ||||||||||||| FIM FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->    
    
    <!--|||||========== FIM COLOQUE ENTRE AS TAGS HEAD =========|||||||||| -->
</head>

<body>

<!--|||||||||||||||||  COLOQUE DENTRO AS TAGS BODY||||||||||||||||||||||||||||| -->

&lt;script>
//Coloque aqui o número de itens de menu
n_divs='15'
</script>

<div class="titulo_menu"  ><a href="java script:void(escondediv('1',n_divs))" class="link_menu" >ABRASIVOS</a></div>
<div id="mdiv1"  style="display:none">
   <table border="0">
           <tr><td id="um" class="itens_menu" ><a href="crbst_6.html" onmouseover="reveza('um')" onmouseout="volta('um')" class="link_smenu" target="alvo">Disco de Corte e Desbaste</a></td></tr>
        <tr><td class="itens_menu"><a href="crbst_84.html" class="link_smenu" target="alvo">Lixa Flap Espuma</a></td></tr>
        <tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">Pontas Montadas</a></td></tr>
        <tr><td class="itens_menu" ><a href="crbst_76.html" class="link_smenu" target="alvo">Rebolos</a></td></tr>
      </table>
</div>

segue.............

Editado Maio 24, 2011 por kuroi
Adicionar tag CODE

Entrar

Menu com sub Menu - ajuda no script

Pergunta

ricardofariasc

Link para o comentário

Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades