nata_yar
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by nata_yar
-
-
Hi, thanks for your reply!
Desired behaviour:
each <p className='highlight'> changes colour on scroll - fades in and out; picture in the header moves down only on scroll.
What I currently have: they change colour only once, on load and thats it. picture moves on its own , on load, without scrolling (you could see it on a deployed website- http://natayar.com/ )
I loaded gsap and scrollTrigger in my index.js via CDN like these:'and I have a separate file with animation where I imported gsap and scrollTrigger like this :
import { gsap } from 'gsap';import { ScrollTrigger } from "gsap/ScrollTrigger";gsap.registerPlugin(ScrollTrigger);Everything works perfectly well on local host but on a deployed website still I get an error as if i didn't load neither of them
gsap-core.js:87 Invalid property scrollTrigger set to {trigger: '.about-container', scrub: true, start: '-60%', end: '20%'} Missing plugin? gsap.registerPlugin()
-
Hello, everyone! I'v been struggling with understanding why my animation worked on scroll on localhost, but after deployment all animations fire on load and not on scroll , here's the live website
What goes wrong:
- the picture in the header is supposed to move down on scroll
- the text in the about section
- the section titles
I built a codepen for the text in About section.
I console logged ScrollTrigger:
ScrollTrigger ƒ ScrollTrigger(vars, animation) {
_coreInitted || ScrollTrigger.register(gsap) || console.warn("Please gsap.registerPlugin(ScrollTrigger)");
this.init(vars, animation);
}Does anyone have any ideas what direction i should look at?
See the Pen vYRgEBy by natalia-yarysheva (@natalia-yarysheva) on CodePen
Need help with Missing plugin? gsap.registerPlugin()
in GSAP
Posted
thank you so much for your help!! I removed the CDNs and it now loads properly😅