Rotating object to face mouse pointer on mousemove

(Jeroen) #1

I have an image (little airplane) and I want the plane to rotate facing mouse pointer. I found some scripts to do that but I can get it to work with Hype. I’m more a designer! Could someone help me rewrite the script for Hype.

This is the script:
var box=$(".box");
var boxCenter=[box.offset().left+box.width()/2, box.offset().top+box.height()/2];


var angle = Math.atan2(e.pageX- boxCenter[0],- (e.pageY- boxCenter[1]) )*(180/Math.PI);        

box.css({ "-webkit-transform": 'rotate(' + angle + 'deg)'});    
box.css({ '-moz-transform': 'rotate(' + angle + 'deg)'});
box.css({ 'transform': 'rotate(' + angle + 'deg)'});




(π•„π•šπ•”π•™π•’π•–π• 𝔾𝕒𝕣𝕠𝕗𝕒𝕝𝕠) #2

(Jeroen) #3

OK, thanks for the link! I’m going to check it out

(π•„π•šπ•”π•™π•’π•–π• 𝔾𝕒𝕣𝕠𝕗𝕒𝕝𝕠) #5

Nice! Other Hype templates are also mentioned here…