100-project-100-days-website/100_projects/82-explore-developer-website/script.js
2023-05-14 08:35:31 +03:00
Ask

19 lines
580 B
JavaScript

{781a40209374ffe2ea8fff9d21b088e8b1cbc0f5 true 580 script.js 0xc00c1a1500}

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);