Tema: Ayuda para hacer un menu estilo carlj jr
Ver Mensaje Individual
  #5 (permalink)  
Antiguo 07/01/2011, 14:32
juanmata
 
Fecha de Ingreso: octubre-2008
Ubicación: Mexico
Mensajes: 78
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Ayuda para hacer un menu estilo carlj jr
[QUOTE=4ng3r;3697049]ahhh ya veo ..pero ya tocaría programarlo la verdad no creo que hallan plugins para un menú de ese tipo. Pero se me ocurre algo rapido usando JQuery

Código HTML: 
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3.   <head>
  4.     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5.     <script src="jquery.js"></script>
  6.     <script>
  7.       $(function(){
  8.         $("#op1").click(function(){
  9.           $("#menu ul").hide();
  10.           $("#menu ul").empty();
  11.           $("#menu ul").append("<li>Opcion 1.1</li>");
  12.           $("#menu ul").append("<li>Opcion 1.2</li>");
  13.           $("#menu ul").append("<li>Opcion 1.3</li>");
  14.           $("#menu ul").append("<li>Opcion 1.4</li>");
  15.           $("#menu ul").show('slow');  
  16.         })
  17.         
  18.         $("#op2").click(function(){
  19.           $("#menu ul").hide();
  20.           $("#menu ul").empty();
  21.           $("#menu ul").append("<li>Opcion 2.1</li>");
  22.           $("#menu ul").append("<li>Opcion 2.2</li>");
  23.           $("#menu ul").append("<li>Opcion 2.3</li>");
  24.           $("#menu ul").append("<li>Opcion 2.4</li>");
  25.           $("#menu ul").show('slow');  
  26.         })
  27.         
  28.         $("#op3").click(function(){
  29.           $("#menu ul").hide();
  30.           $("#menu ul").empty();
  31.           $("#menu ul").append("<li>Opcion 3.1</li>");
  32.           $("#menu ul").append("<li>Opcion 3.2</li>");
  33.           $("#menu ul").append("<li>Opcion 3.3</li>");
  34.           $("#menu ul").append("<li>Opcion 3.4</li>");
  35.           $("#menu ul").show('slow');  
  36.         })
  37.       })
  38.     </script>
  39.     <style>
  40.     <!--
  41.      .menu{
  42.       position: relative;
  43.      }
  44.     //-->
  45.     </style>
  46.     
  47.   </head>
  48.  
  49.   <body>
  50.     <table width="500">
  51.       <tr>
  52.         <td><a href="javascript:void(0)" id="op1">Opcion 1</a></td>
  53.         <td><a href="javascript:void(0)" id="op2">Opcion 2</a></td>
  54.         <td><a href="javascript:void(0)" id="op3">Opcion 3</a></td>
  55.       </tr>
  56.     </table>
  57.   
  58.     <div class="menu" id="menu">
  59.       <ul></ul>
  60.     </div>
  61.   </body>
  62.  
  63. </html>

Espero que sea de ayuda !![/QUOTE

Gracias amigo pero para que desplege el menu a un lado como le podria hacer con iframes o que se te ocurre, si es on iframes como lo pondrias, o tambien se pude poner con jquery o mas como le pondrias el contenido aun lado