GSAP & ScrollMagic and "scale" problem (video)

[hedox]

Hello, 
My "trigger" bar always changes position. It is difficult for me to explain the problem so I recorded the video of it.

If I scroll down really fast, it works. Seems like the trigger element is kind of blocking and creates a barrier.

Video of the problem.

 

In short, my trigger (not the trigger item) from ScrollMagic goes back to the top as soon as it hits the trigger element. 

 

My code : 
 

var tlfirst = new TimelineMax();
tlfirst
.set('.experienceInfo',{scale:3})
.set('.skillsInfo',{scale:3},"+=10")

.from('.experienceInfo',10,{autoAlpha : 0,scale:3})
.from('.skillsInfo',10,{autoAlpha : 0,scale:3},"-=10")

.to('.experienceInfo',10,{autoAlpha: 1,scale:1})
.to('.skillsInfo',10,{autoAlpha: 1,scale:1},"+=10");

var controller = new ScrollMagic.Controller();

var scene1 = new ScrollMagic.Scene({
    triggerElement : '.skillsSection',
    // triggerHook: 0 ,
    duration : "30%",

})
.setTween(tlfirst)
.addIndicators()
.addTo(controller);

[GreenSock]

Welcome to the forums, @hedox. 

 

Unfortunately we don't really support ScrollMagic in these forums (it's not a GreenSock tool), although there are a few people in the community here who have used it and may be able to chime in. I'd suggest that you reach out to the author or post an issue on Github in the ScrollMagic repo. I wish I could help more. Maybe someone else can chime in who has some experience with ScrollMagic.