Last active
November 15, 2016 15:43
-
-
Save VinceVachon/cf5ea1c440cb053bb7f1c61d7de1a192 to your computer and use it in GitHub Desktop.
move element following mouse move based on center of the screen
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// move element following mouse move based on center of the screen | |
const $elToMove = $('.element'); | |
function mouseMoveAnim() { | |
let mouseFromCenterX = 0; | |
let mouseFromCenterY = 0; | |
let divMovX = 0; | |
let divMovY = 0; | |
let windowW = 0; | |
let windowH = 0; | |
let windowCenterX; | |
let windowCenterY; | |
const thresholdX = 0.01; | |
const thresholdX = 0.03; | |
$(window).mousemove((e) => { | |
windowW = window.innerWidth; | |
windowH = window.innerHeight; | |
windowCenterX = (window.innerWidth / 2); | |
windowCenterY = (window.innerHeight / 2); | |
mouseFromCenterX = e.clientX + (windowCenterX * (-1)); | |
mouseFromCenterY = e.clientY + (windowCenterY * (-1)); | |
divMovX = (mouseFromCenterX * thresholdX); | |
divMovY = (mouseFromCenterY * thresholdY); | |
$elToMove.css({ | |
transform: `translate(${divMovX}px, ${divMovY}px)`, | |
}); | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment