Jump to content
Search Community

AsKadir

Business
  • Posts

    156
  • Joined

  • Last visited

Everything posted by AsKadir

  1. Thanks a lot, @PointC ! That what I was looking for.
  2. Hey, I have found a great and straightforward demo on the forum of repeat and reverse animation, which was created by @mikel. Here it is https://codepen.io/mikeK/pen/dyooKjJ But using the latest GSAP version, the reverse animation doesn’t work the same as in the 3.1.1 version. The animation doesn’t stop on mouseleave. My main goal is to have repeated animation on mouseenter. But on mouseleave, I need to reverse only once instead of reversing the whole repeats. I understand I can do that with tweens and overwrite properties on mouseleave, but I'm looking for a better solution with timeline. Can you help me, please? Below is the same animation with the latest GSAP version.
  3. Hi Cassie, It's hard to say. Because I don't know how much time advanced developers need. Let's make it a $100 task. The faster, the better.
  4. Hi there, I'm looking for a developer with advanced skills in Three JS and GSAP. I want to replicate the same hover animation as here https://www.nightingale.world/projects/category/exposure/ I don't need styles or mouse position list moves. And it isn't important to have the same animation. I need to replicate fast image switching because I can't understand the logic. How do they update the timeline on uniform progress and image switch on every mouseenter with debouncing? If it were a slider, that would be easy, but here something more complicated. The task is to provide HTML and JS files or just a codepen. Thanks.
  5. Sorry, I thought I recreated the issue in the demo, but it's working properly there. I didn't notice zIndex. But I still have a trouble on my localhost. Give me some time, I hope I can recreate it.
  6. Hey team, I have a pinned box, which is fixed till the end of the page. And I have the Flickity carousel below. So after the carousel is implemented, the pin stops working. I tried to add ScrollTrigger.refresh() after the carousel init, but it didn't work. In the demo I added a delay for the carousel to show that the box was pinned and then stopped to work. Can you guide me, please?
  7. Hi all, I have extensive code, so I took only the issue part. There is a boolean value in my code, and I'm changing it in a timeline that I can then reverse. The value is changing, but if you open a console and open an object, you'll see it isn't. My question is, am I doing something wrong? Can you help me, please?
  8. @OSUblake, Thanks a lot! You saved me again!
  9. Hi there, Recently I tried to update GSAP from 3.6.0 to 3.8.0 and found issue with Pixi JS. I have a Pixi animation with displacement filter and I also use PixiPlugin. After update it stopped to work and in console I have: DisplacementFilter 'is not a DisplayObject or PIXI was not found. PixiPlugin.registerPIXI(PIXI);' I use webpack and follow rules with GSAP PixiPlugin: import * as PIXI from 'pixi.js'; import gsap from 'gsap'; import { PixiPlugin } from 'gsap/PixiPlugin'; import { Draggable } from 'gsap/Draggable'; gsap.registerPlugin(PixiPlugin, Draggable); PixiPlugin.registerPIXI(PIXI); I though it was Webpack or Pixi JS issue because I updated them too, but after a lot of tests I see that issue with GSAP. You can check this codepen and see error in console. Let me know am I right or not, thanks in advance!
  10. @OSUblake Hi Blake! Thanks a lot! I really appreciate your help!!!
  11. Hello, I made a horizontal container with items inside, it's draggable, scrollable and infinite. It's working great, except dragging not working as excepted for touch devices. I don't have any errors and don't know what to do. Can someone help me, please? I'm sure this demo will help a lot people.
  12. @GreenSock Thanks for your answer, Jack! I will try by myself, if not I will contact you.
  13. I mean scrub: 0.7, so animation of the moving seems like smooth scroll. In the last your codepen you are doing stagger animation, which is not what I want. Let me try to explain in another way, so we have block with elements: https://codepen.io/ChicagoJostik/pen/ExmVOGz Here is another codepen with pinning and elements moving to top, so when user scroll it seems like elements start moving smooth, but actually the block is pinned and elements inside of it moving up: https://codepen.io/ChicagoJostik/pen/dyWYQwo Do you see the difference? So right now I want to add animation for each red box on scroll, I'm using ScrollTrigger: https://codepen.io/ChicagoJostik/pen/PomqKPe But because elements are moving up, their entry point are different from what ScrollTrigger thinks and that's why if you look to the last red box you will see that rotation starts too late.
  14. @Cassie Hello Cassie, Here is another codepen: https://codepen.io/ChicagoJostik/pen/oNWjaYq What I want to have the block ".wrapper" be pinned and move the content ".items" inside of it to top to have smooth scroll, and at the same time to have rotation animation for the boxes. Did you get the point what I want? Sorry for my bad explanation. Thanks a lot!
  15. Hello, I have a block, when user scrolls it becomes pinned and elements inside of it start to move to top with scrub, it's kind of smooth scroll only for this block. So it's working good, but now I have an issue, because I can't understand how can I implement ScrollTrigger animation for elements that inside of this pinned block. I understand why it's not working right now because I move this elements with tween and the trigger position changed. Can you give me advice, please? Thanks in advance!
  16. @OSUblake But never mind. I think it's not a big trouble. Thanks for your time!
  17. @OSUblake Thanks for your answer! I think you misunderstood me, by liveSnap we can limit the dragging distance, right? But I'm telling about browser window's borders, you can leave it and dragging will still work, just try it:
  18. Hello all, I have an issue with Draggable, I inserted your codepen, but it doesn't matter, it happens with any working example where Draggable is. Try to press and hold your mouse on a wrapper and move it from right to left, then not letting go the left mouse button, leave the browser window and move your mouse, you will see that the drag is still working for blocks. Why it happens? Is there a possibility to prevent it? Thanks in advance!
  19. @GreenSock Thanks, Jack! I see what you've done, it's great!
  20. I just want to make text responsive on window resize after animation was done. So visible lines will be responsive, about invisible it doesn't matter. right? Or should I make it in another way? It's actually will be dynamic, the user can add animation to whatever text he/she wants by clicking the button in a WordPress site builder. Can you give me advice, please? I understand that it bad practice what I'm doing, but should I just give up with revert()?
  21. Hello, I have an issue with revert(), I splitted all elements with class .splittext two times to lines, so it's simple animation and everything is working, but I want to revert() every line on animation complete. My questions is - is it possible to target Splittext of every line? I mean something like this.SplitTextVar.revert(). Thanks in advance!
  22. @GreenSock If it is okay on your side, I think it's all my old macbook. Thanks a lot, Jack!
×
×
  • Create New...