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.
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.