harp30

Hello, Is there anyway in gsap to make an infinite looping slider? Any tips? Thank you.

Okay thank you. Changed the code to this: but getting this error: Loading.js:27 Uncaught (in promise) DOMException import TweenLite from "gsap"; import TweenLite from "gsap"; class Loading{ constructor(){ this.smokeVideo = document.querySelector("#js-loading-video"); this.smokeVideo.addEventListener("ended", () => this.removeLoadingSection()); // ERROR HERE NOW this.AnimationEffects(); } textAnimation(){ let textContent = document.querySelector("#js-loading-text-content"); TweenLite.to(textContent, 0.7, { opacity: 0, delay: 2.5, onComplete: () => this.playVideo() }); } AnimationEffects(){ this.textAnimation(); } playVideo(){ this.smokeVideo.play(); this.smokeVideo.playbackRate = 1.5; } removeLoadingSection(){ TweenLite.set(document.querySelector("#js-loading"), {display: "none"}); } } export default Loading;

Hello, I'm trying make the .loading section display none once the video is finished loading but getting this error: Uncaught (in promise) DOMException not sure how to fix, thank you.

Yes I’m also beyond confused. I think I need to take a proper GSAP course. I love it but I always make it complicated than it is. the effect I was trying to create was this one: https://kalpa.parmigiani.com/en/ but my effect disappears right when the counter starts. I was following a gsap counter demo on code pen.io. Im not sure how to fix it. Is there any course or ebook that can help me write proper gsap code?

Hello, Issue on line 34. The timeline goes to the last tween and the tween prior doesn't finish. What am I doing wrong? Any tips to fix? And any advice of the code structure with es6 classes? Thank you.

Thank you everyone for your detailed guidance. Okay so for each page of animations, example: loading page, landing page, and etc. Each set of animations should have their own timeline objects? And I’ll start studying he topics for complex animations! Thank you all!

Scroll effect I meant , sorry. Yes will go through the forums. Yes, I will focus on one thing at a time.. small bits at a time. thank you.

Hello thank you! im going to copy websites to learn, that’s a great idea. ill build websites I see in gsap’s example page, i will start with this one: https://www.igoodi.eu/vision i wanted to know if there’s a tutorial to help me get started with the scroll up effect? Is this a slider? And on scroll the slide changes? If so how to implement the mousewheel and how to set up the HTML/css? thank you! Excited to show you what I come up with.

There are many great sites made by gsap on this website. i want to learn how to create such amazing experiences as well, I’m good with the basics but how to reach the next step with gsap animations? Where/how to learn more compelling animations? Thank you.

Hello, Had a general question when it comes to best practice. example: say we have an animation we want to fade in - or any animation for that matter. Options: 1. do we perform the settings via css file and then animate in JS with GSAP timeline(s) 2. Perform settings in JS via GSAP and then animate via timeline(s) 3. Don’t do any settings and just perform GSAP timeline with from method? to save memory and have best performance, which is the best option? thank you.

Hello, really nejoying greensock. i was just wondering are there any courses or books to help understand the concepts of animation itself so I can take my animations to the next level? thank you.

Hello, I'm trying to recreate this slider: https://bewegen.com/en its under the Accelerating Bike Share section. I managed to create the count slider but having trouble getting it back to count 1 when it hits the end count of 9 - smoothly have it loop back to the start. How to get the count to loop back to the start? Thank you.

Yes! Okay thank you! Going to try this out for a new project. The video that was posted above by @Sahil - how do you plan out or design such interactive animations? Using storyboards? Or is there another way? Thank you.

Okay thank you @mikel and @sahil Its a sprite sheet effect, it appears when you click home cta - logo.

Hello wonderful people! Hope everyone’s day is going well. I just saw this menu toggle effect and was wondering how can one achieve this? http://www.laborfit.com.br/eventos-consultoria-e-treinamento Is it a sprite sheet?