Efecto Lupa

[colettainternet]

Hola a todos,

Bueno, posteo porque como lo dice el título, estoy buscando algún script para poder hacer un efecto lupa sobre unas imagenes. Consideraría que quiero que la lupa funcione en todo el contenido, incluido el texto. (Puede ser Javascript o cualquier otro, pero por lo general los scripts con efectos son Javascript, por eso posteé aca).

Un ejemplo exacto de como quiero que quede es esta web. Funciona con Internet Explorer y hay que presionar el botón 'ZOOM' para que la lupa comience a funcionar.

Espero que alguien pueda asesorarme

La idea es poner unas imagenes tipo collage y poder verlas más grandes en tiempo real con la lupa.

Desde ya muchas gracias


Slaouds

[colettainternet]

Nadie sabe??

[dogduck]

Yo no , pero google sí :

http://www.tecnocodigo.com/dipro/dht...dia&articulo=4

[colettainternet]

Hola dogduck,

Justamente esa página ya la había visto, pero me era dificil modificar los atributos de la imagen, ya que no tiene que ser solo para una imagen sino para un frame entero, digamos que es un script que no se ajusta a mis necesidades. De todas maneras muchas gracias.

¿Alguien sabe algún otro script?

Desde ya muchas gracias.

Slaouds

[caricatos]

Hola:

Con javascript me parece que no se puede, a no ser que todas las medidas estén en porcentaje o algo así (y aún lo dudo...)

Creo que con flash hay más posibilidades, pero es una temática que no controlo...

Saludos

[rrufo]

yo lo he intentado y no lo he conseguido, aunque las capas y el jscript no es lo mio.


mi idea, partiendo del algoritmo propuesto, es la de hacer la misma web dos veces, en capas distintas, una se muestra de fondo y la otra solo se muestra el cuadrado de la lupa, (tal como hace el algoritmo)

pe: si tengo una imagen, en la otra capa la imagen tiene de doble de tamaño.

si tienes una tabla, la otra el doble, tiene un tamaño de letra 10, la otra el doble, creo.

aunque esto genera un problema con las posiciones q no llegue a solventar.

yo lo he dejado, pq para mi proyecto no es operativo la duplicacion, pero si alguien lo quiere intentar, aqui estoy.

[rrufo]

pegale un vistazo a estas dos funciones:

tal vez document.body.style.zoom='200%' pueda ayudarte


function Mag()
{
if(t == 1)
{
document.body.style.zoom='300%'; }
else
{
document.body.style.zoom='200%';
t = 1;
}
}

function UnMag()
{
if(t == 1)
{
document.body.style.zoom='200%';
t = 0;
}
else
{
document.body.style.zoom='normal';
t = 0;
}
}

[dogduck]

Oye muy bueno :apaluso:
Solo le cambié , el orden de la variable t , para que me funcionara en una prueba que hice , en un formulario ante el evento onmousemove="Mag()" y al salir onmouseout="UnMag()"

Código:

<script>
function Mag() 
{
t = 1; 

if(t == 1) 
{
document.body.style.zoom='300%'; }
else 
{
document.body.style.zoom='200%';
}
}

function UnMag() 
{
t = 0;

if(t == 1) 
{
document.body.style.zoom='200%'; 
t = 0; 
}
else 
{
document.body.style.zoom='normal';
}
}