janpaepke / ScrollMagic

The javascript library for magical scroll interactions.
http://ScrollMagic.io
Other
14.9k stars 2.17k forks source link

Moving divs horizontally while scrolling #759

Open FlatAutumn opened 6 years ago

FlatAutumn commented 6 years ago

Title is pretty self-explanatory. I want to move an image while scrolling trough one of the sections in the section wipes example.

I supose is pretty easy but i cant make it work. If i dont use any duration, the animation works perfectly, but i want it to move along the scroll.

If i put any duration it starts to do weird things. I tried with moving from 0% to 100% in the x, with intermediate points and i dont know what to do anymore.

Right now this is my code: //create tween var tween = TweenMax.to("#target",10,{xPercent:-100, left:"100%"});

// create scene to pin and link image animation var scene = new ScrollMagic.Scene({ triggerElement: "#trigger", duration: 10, }) .setTween(tween) .addTo(controller); });

Im not very familiar with GSAP or ScrollMagic so i supose im missing something basic but im stuck at the moment. Thanks in advance.

nbeers22 commented 6 years ago

This is not an issue with the code. If you want help, post it on stackoverflow.com