π How It Works
Click any button below to show a notification. Then hover over the notification - it will pause the auto-dismiss timer! Move your mouse away and it resumes. This prevents notifications from disappearing while you're reading them, just like Sonner in Next.js! π
β¨ Key Features
- Hover to pause timer
- Move away to resume
- Beautiful animations
- Fully responsive
- Smooth interactions
- Easy to use
π§ͺ Test Notifications
Try different notification types and experience the hover functionality firsthand. Each notification has a 5-second timer that you can pause by hovering!
π» Code Example
Here's how easy it is to create notifications with hover functionality:
// Show a notification with hover-to-pause functionality
notificationHelper.success("Your action was successful!", 5000);
// The notification automatically supports hover-to-pause
// No additional code needed!
π‘ Pro Tips
Make the most of the hover functionality:
- Hover over notifications to pause them
- Perfect for reading longer messages
- Move mouse away to resume countdown
- Works on all devices and screen sizes