Foros del Web » Programando para Internet » Javascript »

Menu Desplegable

 Estas en el tema de Menu Desplegable en el foro de Javascript en Foros del Web. Hola Amigos miren tengo un menu deplegable y se me ocurrio hacerlo con javascript y si me puse a buscar en internet y encontre este ...
  #1 (permalink)  
Antiguo 26/06/2008, 16:21
 
Fecha de Ingreso: mayo-2008
Mensajes: 27
Antigüedad: 16 años
Puntos: 0
Menu Desplegable
Hola Amigos miren tengo un menu deplegable y se me ocurrio hacerlo con javascript y si me puse a buscar en internet y encontre este y ya lo implemente para que me sirviera y si corre y todo lo pueden ver en http://sistemashidraulicos.com.mx/ es el del lado derecho donde dice albercas y riego y si jala bien pero lo que quiero y que no puedo hacer es que me lo contraiga osea que le vuelva dar click en el Albercas se contraiga eso no lo puedo hacer y la verdad esque se muy poco java si alguien me ayuda porfavor se le agradeceria aqui dejo el codigo del menu

Código PHP:
    
       Sub GeneraMenu()
        Abrir(myConnection)
        Dim objCmd As New SqlCommand("SELECT DISTINCT(grupo) As gpo FROM tblProductos  ORDER BY gpo", myConnection)
        Dim oDR As SqlDataReader
        oDR = objCmd.ExecuteReader()
        LblMenu.Text = "<table width='170' border=0 cellpadding='0' cellspacing='0'>"
        Dim m, sm As Integer
        Do While oDR.Read
            m = m + 1
            LblMenu.Text = LblMenu.Text & "<tr><td height='22' class='ctd' ><a id='aDC" & m & "' href='#' class='menu_n1' onClick='Menu(DC" & m & ",""C1"",9,10," & m & ");' onMouseOver='this.className=""menu_over1""' onMouseOut='menu_out1(" & m & ",this)'>&nbsp;&nbsp;&nbsp;" & Trim("" & oDR("gpo")) & "&nbsp;&nbsp;&nbsp;</a>" & _
                                          "    <div  id='DC" & m & "' name='DC" & m & "' class='C1Oculto' >" & _
                                          "  <table width='170' border=0 cellpadding='0' cellspacing='0'>"
            
            Dim Query As String
            Abrir(myConnection2)
            Query = "SELECT DISTINCT(familia) AS fam FROM tblProductos WHERE (grupo = '" & oDR("gpo") & "') ORDER BY fam"
            Dim objCmd2 As New SqlCommand(Query, myConnection2)
            Dim oDR2 As SqlDataReader
            Try
                oDR2 = objCmd2.ExecuteReader()
                Do While oDR2.Read()
                    sm = sm + 1
                    LblMenu.Text = LblMenu.Text & "<tr><td class='ctd' height='22'><a id='aDS" & sm & "' href=""javascript:parent.loadIframe('../catalogo/subfamilias.aspx?familia=" & Trim("" & oDR2("fam")) & "')"" class='menu_n2' onClick='menu_activar2(30," & sm & ")' onMouseOver='this.className=""menu_over2""' onMouseOut='menu_out2(" & sm & ",this)'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" & Trim("" & oDR2("fam")) & "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></td></tr>"
                Loop
            Catch ex As Exception
                LblError.Text = ex.ToString() & "<br>" & Query
            End Try
            Cerrar(myConnection2)
            LblMenu.Text = LblMenu.Text & "</table></div></td></tr>"
        Loop
        Response.Write(LblMenu.Text)
        LblMenu.Text = LblMenu.Text & "</table>"
        Cerrar(myConnection)
        Cerrar(myConnection2)
    End Sub
</script>   
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>.estilo {
    FONT-SIZE: 11px; COLOR: black; FONT-FAMILY: Verdana; TEXT-DECORATION: none
}
</style>
<style>.estilo2 {
    FONT-SIZE: 9px; COLOR: black; FONT-FAMILY: Verdana; TEXT-DECORATION: none
}
</style>
<style type="text/css">
<!--
.ctd {
    background-color: #FFFFFF;
    width: 170px;
    height: 22px;
    vertical-align:top;
}
.menu_over1 {
    text-align: left;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    /*text-indent: 5px;*/
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color:#138DC5;
}

.menu_over2 {
    text-align: left;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    /*text-indent: 5px;*/
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color:#138DC5;
}
.menu_over3 {
    text-align: left;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    /*text-indent: 5px;    */
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color:#138DC5;
}

.menu_n1 {
    text-align: left;
    vertical-align:middle;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color: #038E3B;
}

.menu_n2 {
    text-align: left;
    vertical-align:middle;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color: #A4A3A3;
}
.menu_n3 {
    text-align: left;
    vertical-align:middle;
    display: block;
    text-decoration: none;
    font-family: Arial, sans-serif, Tahoma, "Trebuchet MS";
    font-size: 11px;
    font-style: normal;
    color: #FFFFFF;
    width: 170px;
    height: 22px;
    BORDER-top: #FFFFFF 1px solid;
    BORDER-bottom: #FFFFFF 1px solid;
    line-height: 18px;
    background-color: #038E3B;
    
    }

.C1Visible        {visibility: visible; margin-bottom: 0px}
.C1Oculto        {visibility: hidden;margin-top: -800px}
.C2Visible        {visibility: visible; margin-bottom: 0px }
.C2Oculto        {visibility: hidden; margin-top: -800px}
-->
</style>
<script src="js/run.js" type="text/javascript"></script>
</head>
<body bgcolor="#DEF0E5" bottommargin="0" leftmargin="0" topmargin="0" rightmargin="0">
    <form id="Ramas" name="Ramas" runat="server">
        <table>
            <tr>
                <td>
                    <asp:Label ID="LblMenu" runat="server" Text="" Visible="False"></asp:Label>
                </td>                
            </tr>
        </table>    
        <asp:Label id="LblError" runat="server"></asp:Label>
    </form> 
<script>
var activo="";
/*
function menu_borra() {
    var a;
   for (a=1;a<=9;a++)
    {
        if (("a"+a)!=activo)  { document.getElementById("a"+a).className='menu_n1'; }
    
    }

}
*/
    var ed=new Array("none","block");
    function A(e)
    {
        var s=document.getElementById(e).style;
        var ned=(s.display==ed[0])?1:0;
        s.display=ed[ned];
    }

function Menu_borra(c,actual) {
    var a;
   for (a=1;a<=c;a++)
    {
       if (document.getElementById("DC"+a)!=null)    
        {
        this.ca=document.getElementById("DC"+a);
        ca.className  = "C1Oculto";
        }
       if (document.getElementById("aDC"+a)!=null)    
        {
        if (a!=actual)      { document.getElementById("aDC"+a).className='menu_n1'; }
        }
    }

}
function Menu_borra2(c,actual) {
    var a;
   for (a=1;a<=c;a++)
    {
      if (document.getElementById("DS"+a)!=null)    
       {
        this.ca=document.getElementById("DS"+a);
        ca.className  = "C2Oculto";
       }
       if (document.getElementById("aDS"+a)!=null)    
        {
        //alert(
        if (a!=actual) { document.getElementById("aDS"+a).className='menu_n2'; }
        }
    }
}

function Menu_borra3(actual) {
    var a;
   for (a=1;a<=50;a++)
    {
       if (document.getElementById("aDT"+a)!=null)    
        {
        if (a!=actual) { document.getElementById("aDT"+a).className='menu_n3'; }
        }
    }
}

var m_activo1='';
var m_activo2='';
var m_activo3='';

var m_activoi1=0;
var m_activoi2=0;
var m_activoi3=0;

function Menu(id_Div,nombre, c,st,actual) {
    if (nombre=="C1") {    

      Menu_borra(c,actual);     
      //Menu_borra2(st,actual); 
        m_activoi1=actual; 
      m_activoi2=0;m_activoi3=0;
      }
    else { Menu_borra2(st,actual);  m_activoi2=actual; m_activoi3=0;}
    //m_activoi1=0; m_activoi2=0; m_activoi3=0; 
   if(id_Div.className == nombre + "Oculto") {
        id_Div.className = nombre + "Visible";
    } else {
        id_Div.className = nombre + "Oculto";
    }
}

function menu_activar1(c,st,actual) {
    Menu_borra(c,actual);
    Menu_borra2(st,actual); 
    m_activoi1=actual;
    m_activo1='';
}
function menu_activar2(st,actual) {
    //Menu_borra(c,actual);
    Menu_borra2(st,actual);     
    m_activoi2=actual;
    m_activo2='';
}
function menu_activar3(actual) {
    Menu_borra3(actual); 
    m_activoi3=actual;
    m_activo3='';
}
function menu_out1(actual,obj_a) {
  if ( m_activoi1!=actual) { obj_a.className='menu_n1'; }
}
function menu_out2(actual,obj_a) {
  if ( m_activoi2!=actual) { obj_a.className='menu_n2'; }
}
function menu_out3(actual,obj_a) {
  if ( m_activoi3!=actual) { obj_a.className='menu_n3'; }
  }
</script>
<script type="text/javascript">
function autofitIframe(id){ 
if (!window.opera && !document.mimeType && document.all && document.getElementById){
parent.document.getElementById(id).style.height=this.document.body.offsetHeight+"px";
}
else if(document.getElementById) {
parent.document.getElementById(id).style.height=this.document.body.scrollHeight+"px"
}
}
</script>
</body>
</html> 
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 00:32.