Efeito Image Magnify

Para quem não sabe o que é o Image Magnify, logo abaixo segue um exemplo. Clique sobre uma das imagens no exemplo.

É um dos efeitos mais legais para se colocar em imagem que eu aprendi até hoje, e por mais que pareça complicado, é super simples.

Demonstração

Primeiro você deverá pegar o código abaixo e coloca-lo acima de:

</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://static.tumblr.com/b1gnlwd/SrMm1i1zt/jquery.magnifier.js"> </script> Depois irá colocar o código abaixo onde deseja que as imagens apareçam.
<img src="URL DA IMAGEM" class="magnify" style="width:200px; height:200px" />
 Você só irá precisar mexer no segundo código, que é auto-explicativo.

Onde está “URL DA IMAGEM”, você irá colocar a url da imagem.
Em width:200px, você irá trocar o 200px pela largura da miniatura da imagem.
E em height:200px, você irá trocar o 200px pela altura da miniatura da imagem.

Adicionando mais imagens
Basta repetir o segundo código quantas vezes quiser.

Espero que tenham entendido, qualquer dúvida pergunte nos comentários, se usar, credite

Tutorial por: Wellyson Gomes
Editado por: Alecsander Dias