ScalingHawk Smooth Scroll (Powered by Lenis)
| 开发者 | maslam0814 |
|---|---|
| 更新时间 | 2026年5月27日 23:13 |
| PHP版本: | 7.4 及以上 |
| WordPress版本: | 6.9 |
| 版权: | GPLv2 or later |
| 版权网址: | 版权信息 |
详情介绍:
ScalingHawk Smooth Scroll (Powered by Lenis) replaces the default browser scrolling with a smooth, fluid, inertia-based scrolling experience powered by the Lenis scrolling engine.
This plugin enables smooth scrolling in WordPress using the Lenis JavaScript library. This plugin is not affiliated with or endorsed by the Lenis project.
Key Features
- Smooth Inertia Scrolling — Natural, frame-synced scroll animations
- Smooth Anchor Links — Automatically smooths all anchor navigation (#links)
- Fixed Header Support — Auto-detects sticky/fixed headers and offsets scroll targets
- GSAP ScrollTrigger Compatibility — Syncs with GSAP animations automatically
- Scroll-to-Top Support — Universal detection of scroll-to-top buttons across themes
- Conflict Detection — Warns about existing smooth scroll CSS or libraries
- Accessibility — Focus management after smooth scroll for keyboard/screen reader users
- Dynamic Content — Handles AJAX content, page builders, and lazy-loaded sections
- Admin Settings — Full control over scroll duration, smoothness, header offset, and more
- Kadence
- Astra
- GeneratePress
- Flavor
- Flavor starter
- OceanWP
- Elementor-based themes
- Gutenberg block themes
- Custom themes
- Page builders (Elementor, WPBakery, Beaver Builder, Bricks)
- No jQuery dependency
- Single requestAnimationFrame loop
- Lightweight architecture (~12KB total)
- Defers to GSAP ticker when available (no double RAF)
安装:
- Upload the
scalinghawk-smooth-scrollfolder to the/wp-content/plugins/directory. - Activate the plugin through the Plugins menu in WordPress.
- Go to Settings → Smooth Scroll to configure options.
- That's it — smooth scrolling is now active.
屏幕截图:
常见问题:
Does this plugin work with my theme?
Yes. The plugin is designed to be completely theme-independent. It works with all standard WordPress themes and page builders.
Will this conflict with GSAP animations?
No. When GSAP and ScrollTrigger are detected on the page, the plugin automatically syncs the scroll position with ScrollTrigger and uses GSAP's ticker instead of its own animation loop.
Can I disable smooth scrolling on mobile?
Yes. Go to Settings → Smooth Scroll → Mobile & Touch and check "Disable on Mobile".
My anchor links scroll behind the fixed header. How do I fix this?
Go to Settings → Smooth Scroll → Navigation & Anchors and either:
- Set a manual "Fixed Header Offset" value in pixels, or
- Enable "Auto-Detect Header Height" to let the plugin detect your header automatically.
What happens if another smooth scroll plugin is active?
The plugin includes conflict detection. It will log a warning in the browser console and override conflicting CSS scroll-behavior: smooth rules.
Can I use Lenis's data-lenis-prevent attribute?
Yes. Add data-lenis-prevent to any element where you want to disable smooth scrolling (e.g., custom scrollable containers).
更新日志:
1.0.0
- Initial public release
- Smooth inertia scrolling powered by Lenis
- Smooth anchor navigation support
- Fixed and sticky header offset handling
- GSAP ScrollTrigger compatibility
- Mobile and touch device controls
- Accessibility-focused scroll behavior
- Dynamic content and AJAX compatibility
- Universal scroll-to-top button support
- Admin settings panel for customization
- Conflict detection for existing smooth scroll implementations