Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Content Count

  • Joined

  • Last visited

Community Reputation

1 Newbie

About Nysh

  • Rank

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hey guys, Couldn't find any info in the docs about using ScrollTrigger.matchMedia and pointers? I tried it with pointer:coarse and it didn't seem to register? Is this a feature / would it be in the future? Something like below. Thanks heaps ScrollTrigger.matchMedia({ "(pointer: coarse)": function() { // setup animations and ScrollTriggers for pointer: coarse?? }, });
  2. Hey @ZachSaucier~ Thanks so much, that seems to fix the first issue perfectly. However, there is still the issue of the "double jump" when moving the cursor from one box to the other back and forth quickly. Not sure why that's happening? Does it have something to do with the ticker?
  3. Hey @mikel, Thanks for the tip and quick response. I've made the speed value = 0.1 on mouseleave which makes it much smoother on mouseleave, and then I've used a timeout function (which feels a bit hacky) to return the speed variable back to 1.0. as this is the speed needed for the cursor normally. This works ok, but due to the timeout the cursor still jumps back into position. Is there a way to make the speed return to 1.0 smoothly after mouseleave , using gsap? https://codepen.io/Nysh/pen/JjbNLwP
  4. Hey guys, I'm having a couple of issues with animating a cursor. The aim is to have the cursor smoothly snap into position when entering a box and smoothly animate back to mouse position on leave (rather than jump to the new mouse position). Also, the cursor should smoothly animate when moving from one box to the other quickly. 1. How would I go about animating the cursor smoothly back to the mouse position after leaving the box (not sure how to store the mouse position while active = false. 2. When moving from one box to the other quickly, how would I prevent the cursor from
  5. Yooo @Dipscom~ Thanks so much ~!! I've updated the Codepen and it seems to be working exactly as intended! I'm not updating the mouse.x and mouse.y on dragEnd though? i've kept the active variable false the whole time, not sure if that is why? Thanks again for taking the time to help us out. Much appreciated. https://codepen.io/Nysh/pen/jOMogZa
  6. Hey @Dipscom Thanks so much for the prompt response. That makes sense about the values not being shared...sorry for the noob questions... how would I go about storing those values in the mouse object? I would love to make it work, but i am a bit out of my depth
  7. Hey fam, As can be seen in the demo, when the drag completes, the cursor jumps back to its original position, before updating on mousemove. I'm wondering if there's a way to store or update it's position during the drag event (using quicksetter?), to avoid the awkard "jump" at the end. I'm using Flickity for the carousel, but the concept might be helpful/applicable for anyone using a GSAP custom cursor with a draggable slider. Any guidance would be greatly appreciated . Cheers ~!
  8. yooo~ that's so slick~ Thank you @mikel! That approach is so much better and cleaner. I applied it to my original width animation and now it works perfectly. Thanks again legend !! here's the updated codepen~ https://codepen.io/Nysh/pen/PoGLNWX
  9. Hey guys, Im trying to make an 2 image gallery/accordion in which the the hovered image expands and and the non hovered reduces in width. I've created a minimal demo of my approach, but i'm getting a "jump" when the mouse goes from one image to the other. I'm assuming this is because of the "fromTo". Wasn't sure how to go about it, if i needed to clearProps? Simple Criteria: - When the user mouse leaves completely, both images should return to their initial width (50%). - If the user moves from one image to the other, the widths should adjust smoothly. Sorry
  10. Hey guys, I'd like to achieve an infinite horizontal animation that changes direction (and speed) depending on whether the user scrolls up or down. The animation currently changes with scroll, but eventually stops (see codepen). I know there are a few examples of infinite loops on the forum, however I wasn't able to combine them with a change in scroll direction. Any help on how to create an infinite loop with this example would be amazing Cheers~
  11. Perfect! Thanks so much @akapowl
  12. Hey guys, Wondering if its possible to achieve a text-indent on the first line of text, while using Split Text. I've tried using " " within spans as someone had suggested before, but doesn't seem to work. Any help is greatly appreciated.
  13. Zach! Thanks so much mate. That worked https://codepen.io/Nysh/pen/qBZYPMM?editors=1010
  14. Hey guys, I've been following some threads / tutorials on rendering SVG on canvas. My issue is quite simple. I'm trying to make a gooey menu entrance/exit animation using canvas. If I resize the window after the gooey menu is open, the menu suddenly disappears~ I've made a simple codepen to demonstrate. If the animation is on repeat, and then resize it works fine, so I'm guessing the issue has to do with the my resize and/or animation function? Not sure why it's happening. Any help is greatly appreciated. Thanks in advance
  15. ahh no worries! Hey thank you so much for all the info. will def move to the new syntax. What's the ETA looking like for the upcoming release?