Smooth Scroll UserScript
Description:
This UserScript enhances your browsing experience by enabling smooth, animated scrolling on web pages. Unlike the default, jarring scroll behavior, this script provides a more fluid and visually pleasing way to navigate through content. It's designed to be customizable, allowing you to adjust the scrolling speed and smoothness to your personal preference.
Note: While this script is designed to be lightweight and performant, users on low-end PCs may experience some slight lag during scrolling. This is due to the increased processing required for the smooth animation.
Key Features:
- Smooth Scrolling: Replaces the default jumpy scroll with a smooth animation.
- Customizable: Allows you to adjust scroll smoothness and acceleration.
- Intelligent Scrolling: Only animates when a significant scroll distance is detected.
- Dynamic Refresh Rate: Automatically adjusts animation refresh rate for optimal performance.
- Works Across Elements: Smooth scrolling works not just on the main page, but also on scrollable elements within the page.
- Passive Event Listener (Optional): Allows users to configure if they want to use passive event listeners for enhanced performance.
- Memory Efficient: Uses modern JavaScript techniques to avoid memory leaks.
How It Works:
This UserScript listens for mouse wheel (or trackpad) scroll events. When it detects one, it smoothly animates the scroll position of the page or scrollable element. It works by:
- Intercepting Scroll Events: Catches mouse wheel events, preventing the default scroll behavior.
- Calculating Scroll Amount: Determines how much to scroll based on the event.
- Animating the Scroll: Uses
requestAnimationFrame
to incrementally move the scroll position, creating a smooth effect.
- Dynamic Speed Adjustment: Adjusts scroll animation speed dynamically depending on the speed of the scroll and the desired smoothness.
- Stopping Scroll: Stops the animation when scrolling is no longer detected or the maximum animation duration is met.
Settings:
The script includes adjustable settings that you can modify in the script's code:
-
scrollSmoothness
: Controls the animation smoothness. A value of 0
means the scroll will be very smooth and slow, 1
means the animation is going to be closer to the default speed. The best value is somewhere around 0.5
.
-
scrollAcceleration
: Controls how fast the scroll speed increases. Higher values cause a more aggressive acceleration, lower values less of an acceleration.
-
debugMode
: Set to 1
to see console logs from the script; set to 0
to disable logging.
-
targetRefreshRate
: Target animation refresh rate.
-
maxRefreshRate
: Maximum refresh rate used for the animation.
-
minRefreshRate
: Minimum refresh rate used for the animation.
-
animationDuration
: Maximum duration (in milliseconds) for a scroll animation.
-
scrollThreshold
: Minimum scroll distance required to trigger the smooth scrolling animation.
-
passiveEventListeners
: If you want to use passive event listeners, set to true
; false
is the default value.
Installation:
- Install a UserScript manager (e.g., Tampermonkey, Violentmonkey).
- Copy the code for this script.
- In your UserScript manager, create a new script and paste the code.
- Save the script, and it will now automatically run on all websites.