Wednesday 15 July 2015

javascript - Parallax Based on Mouse Posistion in a div -



javascript - Parallax Based on Mouse Posistion in a div -

i made parallax function using greensock, , works pretty good. problem know how find pagex value. page margins set auto pagex varies depending on user. tried write function find new starting point x value based on parent div, can't seem new starting point variable work parallax function.

$('#viewport').mouseover(function(e){ var parentoffset = $(this).offset(); var relx = e.pagex - parentoffset.left; var rely = e.pagey - parentoffset.top; homecoming relx; }); function doparallax(){ var backlayer = document.getelementbyid('bggrid'); var middlelayer = document.getelementbyid('graphs'); var frontlayer = document.getelementbyid('notes'); $('#viewport').mousemove( function(event){ var bmouse = event.relx / 3; tweenlite.to(backlayer, 1, { css:{left:'-' + bmouse + 'px'}, overwrite:true } ); var mmouse = event.relx / 0.205; tweenlite.to(middlelayer, 1, { css:{left:'-' + mmouse + 'px'}, overwrite:true } ); var fmouse = event.relx / 0.5; tweenlite.to(frontlayer, 1, { css:{left:'-' + fmouse + 'px'}, overwrite:true } ); $('#train').css({'left':event.clientx - 200}); } ); } settimeout('doparallax()', 2000);

any help appreciated.

javascript jquery html parallax greensock

No comments:

Post a Comment