For some reason whenever I try to use GSAP animations on my site it does not work. I felt like I checked everything. I double checked it on a new fresh Webflow site too. I am following the steps provided in the youtube link below. I have deleted and rechecked multiple times. I've tried putting the code in the project setting tab where you can insert code and also the embed feature that Webflow has. I made sure to put code in the "before</body> tag". Code I used is below.
Any help is supppppper appreciated thank you so much!
Code used:
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.8.0/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.8.0/ScrollTrigger.min.js"></script>
<script>
gsap.registerPlugin(ScrollTrigger);
ScrollTrigger.defaults({
markers: false
});
// Animate From
$(".section_home_intro").each(function (index) {
let triggerElement = $(this);
let targetElement = $(".nav_logo");
let tl = gsap.timeline({
scrollTrigger: {
trigger: triggerElement,
// trigger element - viewport
start: "top top",
end: "bottom top",
scrub: 1
}
});
tl.from(targetElement, {
width: "100%",
y: "90%"
duration: 1
});
});
</script>
Webflow site-link:
https://ratunuman-com.webflow.io
Youtube Tutorial I'm following:
https://youtu.be/x-BVEhyYW50
Please let me know if there is any other details I could provide.
Thank you again!
