Ver Mensaje Individual
  #2 (permalink)  
Antiguo 26/03/2010, 04:15
Dany_s
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 14 años, 11 meses
Puntos: 65
Respuesta: Ayuda con Jquery y fadeIn fadeOut

Código HTML:
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
    $( function (){
        $('#enlaces a').click( function (){
            //Al div que esta visible lo oculto
            $('#contenedorinfo>div:visible').fadeOut();
            //Recupero el index del enlace clickeado
            index = $('#enlaces a').index( $(this) );
            //Muestro el div que tiene mismo indice que el enlace clickeado
            $('#contenedorinfo>div:eq('+index+')').fadeIn();
        });
    });
  </script>
  <style>
      #contenedorinfo>div{display:none}
  </style>
</head>
<body>

<ul id="enlaces">
	<li><a href="#">Enlace 1</a></li>
	<li><a href="#">Enlace 2</a></li>
	<li><a href="#">Enlace 3</a></li>
	<li><a href="#">Enlace 4</a></li>
</ul>

<div id="contenedorinfo">
    <div>
    	esta es la info1
    </div>
   	<div>
    	esta es la info2
    </div>
   	<div>
    	esta es la info3
    </div>
   	<div>
    	esta es la info4
    </div>
</div>

</body>
</html>