Ver Mensaje Individual
  #15 (permalink)  
Antiguo 23/07/2009, 17:45
Avatar de djaevi
djaevi
 
Fecha de Ingreso: marzo-2007
Ubicación: Moreno, Buenos Aires
Mensajes: 400
Antigüedad: 18 años
Puntos: 47
Respuesta: Agrandar imagen al pasar

Hola mira te lo dejo en un rar aver si te sirve y lo podes llegar a entender como funciona, lo comprimi porque lleva unas imagenes de muestra creo que lo que hace el ejemplo que me pasaste es llamar mediante los rollover peliculas flash que hacen el zoom ese interno y mediante flashvars le debe pasar que imagen mostrar yo lo que te hice es que al hcer roll over apareezcan por fade la imagen en grande en otro div fijate si te sirve...

Otra cosa lo arme con jquery la libreria esta incluida en el rar te aclaro x si ves cosas raras en el codigo

http://rapidshare.com/files/25930255...Query.rar.html

Dejo el codigo por si alguien quiere verlo...

Código HTML:
<style>
a {color:#ffffff;}
#maxDiv {
width:300px; display:none; z-index:100; 
position:absolute; top:10px; left:0px; border:dashed;
}
</style> 
Código:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var cells = $('td');
		for (var i=0; i<cells.length; i++) {
			var string = "";
			string += '<a href="#">';
			string += '<img id="'+i+'" class="galeria" src="small'+(i+1)+'.jpg">';
			string += '</a>';
			cells[i].innerHTML = string;
		}
	$('.galeria').hover(
      function () {
	  	$('#maxDiv').html('<img src="full'+(Number(this.id)+1)+'.jpg">');
	  	$('#maxDiv').css('left', ((this.id%2)+1) * this.width + 30);
        $('#maxDiv').fadeIn(100);
      }, 
      function () {
        $('#maxDiv').fadeOut(100);
      }
    );
})
</script>
Código HTML:
<div id="maxDiv"></div>
<table>
<tr>
<td></td><td></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td></td><td></td>
</tr>
</table> 
Salu2 ojala te sirva :D