Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
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(){ 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.
Carregando comentários...