[SOLUCIONADO] Alguien que sepa JQueryyy

Iniciado por Devilboy, Noviembre 21, 2013, 02:10:08 PM

Tema anterior - Siguiente tema

0 Miembros y 1 Visitante están viendo este tema.

Imprimir
Ir Abajo Páginas1
Acciones del Usuario
Noviembre 21, 2013, 02:10:08 PM Ultima modificación: Agosto 20, 2014, 08:55:50 PM por Expermicid
POr favor, necesito que alguien que sepa javascript me ayude con un menu

alguien????????????????????????????????????????

Veo Una Energia Que Con Deceo de Justicia... Veo Mas Alla de LAs Letras Escritas...
Veo Un Hacktivismo Puro... Nacido De lo Mas Profundo De un Corazon..
Con La Mirada Firme En Defender Mis Ideales...

Noviembre 21, 2013, 02:16:21 PM #1
Pon el codigo o lo que necesites para poder ayudarte. O mas informacion acerca de lo que necesitas

Noviembre 21, 2013, 02:25:08 PM #2
Hay un menu pero lo que quiero es agregarle otro nivel al menu

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Veo Una Energia Que Con Deceo de Justicia... Veo Mas Alla de LAs Letras Escritas...
Veo Un Hacktivismo Puro... Nacido De lo Mas Profundo De un Corazon..
Con La Mirada Firme En Defender Mis Ideales...

Noviembre 21, 2013, 02:33:42 PM #3
Seria una especie de submenu?

> Home
>> Descargas
>>> Linux
>>> Windows

Algo asi?

Noviembre 21, 2013, 02:41:05 PM #4
si exacto, ahi el menu que está solo viene menu padre e hijo y yo quiero agregar otro nivel

abuelo
          padre
                    hijo

Veo Una Energia Que Con Deceo de Justicia... Veo Mas Alla de LAs Letras Escritas...
Veo Un Hacktivismo Puro... Nacido De lo Mas Profundo De un Corazon..
Con La Mirada Firme En Defender Mis Ideales...

Noviembre 21, 2013, 03:07:21 PM #5 Ultima modificación: Noviembre 21, 2013, 03:09:46 PM por Jimeno
Creo que te refieres a esto: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

HTML:
Código: html5
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
    <title>Menu Horizontal</title>   
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" />   
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>   


Script:
Código: javascript

<script type="text/javascript">
    var ulmenuitem;
// Función para asignar la class "current" a la página en la que nos encontramos
    jQuery(function() {
// Aplicamos la función a todos los elementos <a> de nuestro menú
  jQuery('#menu-principal a').each(function() {
//Comprobamos que la url coincida
    if (jQuery(this).attr('href')  ===  window.location.pathname ) {
// Si coincide aplicamos la class "current" al elemento <a>
      jQuery(this).addClass('current');
// Y también mostramos su submenú aplicando la class "active" a su correspondiente <ul>
      ulmenuitem = jQuery(this).parent().find('ul').addClass('active');
    }
  });
});         
// Función para aplicar la class "active" a los submenus (<ul>)
    function ulmenu_open(){
// Cerramos los posibles submenus que pudieran encontrarse abiertos
           ulmenu_close();
//Abrimos el submenú aplicando la class "active" al elemento "ul"
           ulmenuitem = jQuery(this).find('ul').addClass('active');
    }
// Función para cerrar el submenú. Sacando la class "active" el submenú vuelve
// a estar escondido ya que en el CSS hemos definido visibility: hidden   
    function ulmenu_close(){
        if(ulmenuitem) ulmenuitem.removeClass('active');
    }   
//LLamamos a la función ulmenu_open cuando pasamos con el mouse por encima de 
//los elementos de nuestro menú.        
    $(document).ready(function(){ 
        $('#menu-principal > li').bind('mouseover', ulmenu_open)
    });
</script>


CSS simple aplicado:
Código: css
* {
    border:none;
    margin:0;
    padding:0;
}
 
body {
    background:#fff;
    color: #000;
    font:12px Arial, Verdana, sans-serif;
}
 
 
h1 {
    font-size:20px;
    margin-bottom:20px;
 margin-left: 13px;
}
 
#wrap {
    margin:10px 10px auto;
 
}
 
#header {
    margin-bottom:20px;
}
 
 
/*Menu Styles*/
#primary-menu {
    background: url("images/bg-primary-menu.png") repeat-x scroll 0 0 transparent;
    height: 66px;
    margin: 0 auto;
    width: 100%;
}
#menu-principal{
    margin: 0;
    padding: 0;
    height:33px;
}
 
#menu-principal li {   
    float: left;
    list-style: none;
    border-right: 1px solid #FFFFFF;
}
 
#menu-principal li a {   
    display: block;
    padding: 8px 12px;
    text-decoration: none;
    color: #fff;
    text-transform:uppercase;
    text-align:center;
font-weight: bold;
}
 
#menu-principal a:hover {   
    background: #000;
}
     
#menu-principal li ul {   
    position: absolute;
    visibility: hidden;
 height: 36px;
}
 
#menu-principal li ul li {   
    border-right: 1px solid #FFFFFF;
}
 
#menu-principal li ul li a {
 padding: 10.5px 12px;
}
 
#menu-principal li ul li a:hover {   
    background: #000;
}
 
#menu-principal a.current {
background: #000;
}
 
#menu-principal li ul.active {   
    margin: 0 0 0 10px;
    visibility: visible;
 left: 0;
}
Contacto: @migueljimeno96 -
Noviembre 21, 2013, 03:08:31 PM #6
lo que pasa es que el menu que yo necesito es vertical y no horizontal

Veo Una Energia Que Con Deceo de Justicia... Veo Mas Alla de LAs Letras Escritas...
Veo Un Hacktivismo Puro... Nacido De lo Mas Profundo De un Corazon..
Con La Mirada Firme En Defender Mis Ideales...

Noviembre 21, 2013, 03:11:14 PM #7
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
lo que pasa es que el menu que yo necesito es vertical y no horizontal
Creo que te refieres a esto:
Código: html5

	
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es">
<head>
  <title>Emenia Demo - Menú vertical desplegable con jQuery</title>
  <link rel="stylesheet" type="text/css" href="css/default.css" />
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">            
  $(document).ready(function(){ // Script del Navegador
    $("ul.subnavegador").hide();                        
    $("a.desplegable").toggle(
      function() {
        $(this).parent().find("ul.subnavegador").slideDown('fast');
      },
      function() {
        $(this).parent().find("ul.subnavegador").slideUp('fast');
      }                        
    );      
});
</script>
</head>
<body>
  <div id="contenido-demo">      
   <h2>Menú vertical desplegable con jQuery</h2>
 
   <ul class="navegador">
    <li><a href="#" title="Opción 1">Opción 1</a></li>
    <li><a href="#" title="Opción 2">Opción 2</a></li>
    <li><a href="#" class="desplegable" title="Opción 3">Opción 3</a>
      <ul class="subnavegador">
        <li><a href="http://www.google.es" title="Ir a Sub-Opción 3-1">Sub-Opción 3-1</a></li>
        <li><a href="#" title="Ir a Sub-Opción 3-2">Sub-Opción 3-2</a></li>                  
        <li><a href="#" title="Ir a Sub-Opción 3-3">Sub-Opción 3-3</a></li>
        <li><a href="#" title="Ir a Sub-Opción 3-4">Sub-Opción 3-4</a></li>
      </ul>
    </li>      
    <li><a href="#" class="desplegable" title="Opción 4">Opción 4</a>                  
      <ul class="subnavegador">
        <li><a href="#" title="Ir a Sub-Opción 3-1">Sub-Opci&oacute;n 3-1</a></li>
        <li><a href="#" title="Ir a Sub-Opción 3-2">Sub-Opción 3-2</a></li>                  
        <li><a href="#" title="Ir a Sub-Opción 3-3">Sub-Opción 3-3</a></li>
        <li><a href="#" title="Ir a Sub-Opción 3-4">Sub-Opción 3-4</a></li>
     </ul>
    </li>
  </ul>
</div>      
</body>
</html>

Fuente: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Contacto: @migueljimeno96 -
Imprimir
Ir Arriba Páginas1
Acciones del Usuario