19 lines
580 B
JavaScript
19 lines
580 B
JavaScript
|
let controller = new ScrollMagic.Controller();
|
||
|
|
let timeline = new TimelineMax();
|
||
|
|
|
||
|
|
timeline
|
||
|
|
.to(".rock", 10, { y: -300 })
|
||
|
|
.to(".girl", 10, { y: -200 }, "-=10")
|
||
|
|
.fromTo(".bg1", { y: -50 }, { y: 0, duration: 10 }, "-=10")
|
||
|
|
.to(".content", 10, { top: "0%" }, "-=10")
|
||
|
|
.fromTo(".content-images", { opacity: 0 }, { opacity: 1, duration: 3 })
|
||
|
|
.fromTo(".text", { opacity: 0 }, { opacity: 1, duration: 3 });
|
||
|
|
|
||
|
|
let scene = new ScrollMagic.Scene({
|
||
|
|
triggerElement: "section",
|
||
|
|
duration: "300%",
|
||
|
|
triggerHook: 0,
|
||
|
|
})
|
||
|
|
.setTween(timeline)
|
||
|
|
.setPin("section")
|
||
|
|
.addTo(controller);
|