amshath dharama

@mvaneijgen thanks for the support, heureka issues are fixed when we are working with angular we should use import and resgisterPlugin part which solved the issue, line number 3 and line number 16 fixed the issue, thanks for the support hope the reason for this topic is fixed, let me mark as complete import { Component, OnInit } from '@angular/core'; import gsap from 'gsap'; import ScrollTrigger from "gsap/ScrollTrigger"; @Component({ selector: 'app-recent-work', templateUrl: './recent-work.component.html', styleUrls: ['./recent-work.component.scss'] }) export class RecentWorkComponent implements OnInit { constructor() { } ngOnInit(): void { gsap.registerPlugin(ScrollTrigger); const container = document.querySelector(".recent-work-wrapper") const scrollBox = gsap.timeline({ scrollTrigger: { trigger: container, start: "top 80%", end: "bottom 20%", toggleActions: "restart none none reverse", markers: true, scrub: true, } }) scrollBox.to(container, { scale: 0.8, }) } }

@mvaneijgen thanks again for the awesome fix and simple and easy explanation on toogleActions, Do you know the same code which is working on codepen fine but not working properly on angular, I've triggered the animation in ngOnInit but animation is not working on scroll

And one more thing when I tried the same code on angular it is not working, as expected or same like codepen I'm using gsap : 3.12.2 installed in my project and used the same code as codepen but that is not working, any thought about this

Hi @mvaneijgen, First I want to thanks for your valuable comment which almost help me to understand, since I'm new to this tech, your comment help me lot, so far I have triggered the animation while scroll to bottom and now trying revert the element to it's actual state while scrolling up, I have saved my latest changes , that would be great if you can have a look on my code and give me some feedbacks and please guide me I'm going something wrong to when scrolling up thanks again,

What I mean by div is element which as id of container Note : this is landing page and once the page load we can see the div in the viewport, I want to make the width to 90vw when user reaches the div or user reaches little bit top to the div content