react-scroll-up icon indicating copy to clipboard operation
react-scroll-up copied to clipboard

Conflict with scroll-behaviour:smooth in Next.js 13 with Tailwind CSS

Open emre-turan opened this issue 1 year ago • 1 comments

I'm using the react-scroll-up package in a Next.js 13 application created with the app router, and it's working quite well. However, I've encountered an issue that I believe needs attention.

When I add a Tailwind CSS class for smooth scrolling in the HTML or include scroll-behaviour:smooth in the global.css within the body, the react-scroll-up package stops working.

Here's what I've tried:

  • I've ensured that the package is working correctly without the scroll-behaviour:smooth property.
  • I've attempted to apply the scroll-behaviour:smooth property only to specific elements, avoiding global application.
  • I've reviewed the package documentation and found no warnings or guidance related to this issue.

I would appreciate any insights or solutions to this conflict, as it seems to be hindering the smooth integration of the package with Next.js 13 and Tailwind CSS.

emre-turan avatar Aug 09 '23 22:08 emre-turan

I have a similar issue with react 18 + tailwind css when setting scroll-behavior: smooth, after clicking the scroll button nothing happens, but when I trigger the mousewheel, the scroll begins. Any possible fixes for this?

BasselBlal avatar Sep 29 '23 02:09 BasselBlal