Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Anderson Nunes

Alguem conhece este plugin?

Recommended Posts

Olá pessoal, será que isso é um plugin ou foi feito na mão mesmo?

 

http://especial.netshoes.com.br/nikebootroom/produto/123-4277-046

 

clique na imagem da jaqueta para ampliar, veja que a imagem amplia e se move de acordo com o mouse.

 

Alguem conhece-o ou sabe de algo parecido?

 

Valeu

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se fuçar pelo google aí com certeza acha um plugin que faz isso. mas nem precisa, isso é fácil de fazer com jquery.

 

Baixe a imagem

http://especial.netshoes.com.br/nikebootroom/img/produtos/123-4277-046_zoom_1.png

 

Coloque em uma pasta, crie um arquivo HTML (tipo "teste.html") e coloque-o na mesma pasta dessa image. Coloque o seguinte conteúdo nesse arquivo.

 

 

 
<style type="text/css">
#imagem {
  position: absolute;
  z-index: 1000;
  cursor: crosshair;
}
</style>
 
 
<img src="123-4277-046_zoom_1.png" id="imagem">
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>  
<script type="text/javascript">
$("#imagem").mousemove(function(evt){
  console.log(evt);
 
  var hh = evt.target.height / 2;
  var hw = evt.target.width / 2;
  $('#imagem').animate({'top': evt.clientY - hh, 'left': evt.clientX - hw}, 30, "linear");
});
 
</script>

 

Rode o arquivo no navegador.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.