Ir para conteúdo

POWERED BY:

Arquivado

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

gumetis

Animation com Mousewheel

Por , em Javascript

Recommended Posts

gumetis    0

gumetis
Postado

Boa tarde,

 

Primeiramente sou iniciante em JS, gostaria de saber como fazer esse exercicio:

 

Fazer com que a imagem rotacione com o Mousewheel?

 

Meu codigo:

 

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<title></title>
	<link rel="stylesheet" media="all" href="estilo.css" />
 <script src="http://code.jquery.com/jquery-1.7.1.js" type="text/javascript"></script>
 <script src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js" type="text/javascript"></script>
 <script src="jquery.mousewheel.js" type="text/javascript"></script>
 <script src="jquery.mousewheel.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(window).load(function(){
$("#img").rotate({
bind:
	{
		click: function() { 
			// teste
			$(this).rotate({animateTo:180})
			//alert('Clicado');
		},
		mouseenter: function() {
			$(this).rotate({animateTo:0})
			//alert('Clicado');
		}
	}
});
});
</script>

</head>	
<body>
<div id="div">
<img id="img" src="img.jpg" alt="" />
<br>
<img id="image" src="https://www.google.com/images/srpr/logo3w.png" style="-moz-transform: rotate(0deg);">
</div>
<p>Loren</p>

</body>
</html>

 

Mousewhell

// using bind
$('#my_elem').bind('mousewheel', function(event, delta) {
   console.log(delta);
});

// using the event helper
$('#my_elem').mousewheel(function(event, delta) {
   console.log(delta);
});

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito