Skip to content

Added ability to pause particle generation for smooth transitions between animation on/off#86

Open
admxrd wants to merge 6 commits intotholman:masterfrom
Ad-Magic:master
Open

Added ability to pause particle generation for smooth transitions between animation on/off#86
admxrd wants to merge 6 commits intotholman:masterfrom
Ad-Magic:master

Conversation

@admxrd
Copy link

@admxrd admxrd commented Jan 22, 2025

Solves #52 -- previously, using destroy would immediately delete all active particles.

Now you can pause onMouseLeave and resume onMouseEnter.

Example:

  const cursor = useRef<CursorEffectResult & PausableResult | null>(null); 
  const dom = <element you want to track>

  React.useEffect(() => {
    if (!dom) return;

    const domElement = dom as Element;
      dom.addEventListener('mouseenter', (e) => {
        if (cursor.current) {
          cursor.current.resume();
          return;
        }
        cursor.current = new emojiCursor();
      })

      dom.addEventListener('mouseleave', (e) => {
        if (cursor.current) {
          cursor.current.pause();
        }
      })
  }, [dom]);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants