Vincent D

Hahaha yes I know, but I just found out that the 10 for the delay is actually the "original" time. So if you change variable to another number, you need to change that number for the delay too. Edit: Or create another variable ^^

Thanks you sooooo much! I really need this, now I will try to understand it because it bugs me not to understand. You gave me the key for it and I'm really thankful for it!! ?

Hi! I'm doing a module where the words are sliding and need to always be at the same speed even if they have a different length. I managed to get very far but I'm stuck at the very end (I think), where I can't calculate the delay for when the words wrap. What I know is that the first line needs a delay of around0.8 and the second one needs a delay of around 1.225. How does that delay works? Because I can't have hardcoded numbers since the size will change. Thanks in advance ? Here's a link to an image showing the problem : https://pasteboard.co/JCa7H2P.png

Thank you! I didn't know that

Hi, I've been on this problem for a couple of hours and I can't seem to understand why my code doesn't work on my website while it does on codepen. I have even created a new file just to try this it on a clean sheet but it still doesn't work. Why is that? Here's the link for the website that I'm trying it on : https://treize.dev/gsap_forum/ Here's the link for the codepen : https://codepen.io/d00td00t/pen/rNLEjNo Thanks in advance! ?

Thanks a lot! will-change: transform; did fix my bug. I will try to fix my synthax too, didn't know i was using an old one ?

Hi, I'm trying to do an animation where the image changes rapidly while it follows the cursor smoothly. The problem is that the image leave a weird "shadow" in the background when it moves. I've tested it on Firefox, Edge, Chrome and Opera (On two computers) and it occurs on all browsers beside Firefox. Is this a known bug? It is because of my TweenMax animation or my <img> that its src changes. Here's the code for the change of image : var imagesArray = $(this).data('images'); var index = 1; $('.follow-cursor img').attr('src', imagesArray[0]); imgChanger = setInterval(function () { if (index >= imagesArray.length) { index = 0; } $('.follow-cursor img').attr('src', imagesArray[index]); index++; }, 175); Here's the code for the "sliding" animation : $trigger.mousemove(function (e) { $parentOffset = $(this).parent().offset(); relX = e.pageX - $parentOffset.left - $follower.outerWidth() * 0.5; // Float = percentage relY = e.pageY - $parentOffset.top - $follower.outerHeight() * 0.7; // Float = percentage mouseX = e.pageX; mouseY = e.pageY; }); posX = 0; posY = 0; var imgFollow = TweenMax.to({}, 0.005, { repeat: -1, onRepeat: function () { if (relX && relY) { posX += (relX - posX) / 9; posY += (relY - posY) / 15; TweenMax.set($('.invert'), { css: { x: position.left - posX, y: position.top - posY, }, }); TweenMax.set($follower, { css: { x: posX, y: posY, }, }); } }, paused: true, }); ezgifcom-gif-maker-1-kb79xxyl-gz7qgyco_I0gkbnRR.mp4