چۈشەندۈرۈش
The core Tabs block (WordPress 7.1+) shows and hides its core/tab-panel
content by toggling the hidden attribute via the Interactivity API, which
reveals it abruptly. This plugin adds a small animation to that reveal and a
Settings Tabs Animation screen to control it, with no theme changes
required.
Features:
- Five animation types: Fade, Slide right, Slide left, Slide up, Slide down.
- Adjustable duration (0–3000ms) and easing (ease, ease-in, ease-out,
ease-in-out, linear). - Respects the visitor’s reduced-motion preference.
- A single small inline stylesheet – no build step, no JavaScript.
ئېكران كەسمىسى
ئورنىتىش
- Upload the plugin to
/wp-content/plugins/elliott-richmond-tabs-animation. - Activate through the ›Plugins‹ screen in WordPress.
- Visit Settings Tabs Animation to choose an effect, duration, and easing.
FAQ
-
Does this work with any theme?
-
Yes. The animation targets the core Tabs block’s own markup
(.wp-block-tab-panel), not anything theme-specific, so it works with any
block theme or classic theme that supports the core Tabs block. -
Can different Tabs blocks on the same site use different animations?
-
Not currently — one setting applies site-wide to every Tabs block.
-
Does it affect page load performance?
-
No extra HTTP request: the animation CSS is added as a small inline
stylesheet, and there’s no JavaScript. -
What if a visitor has reduced motion enabled?
-
The animation is disabled automatically for visitors whose OS/browser
requestsprefers-reduced-motion: reduce; panels appear instantly instead.
باھالاشلار
تۆھپىكار ۋە ئىجادكار
«Elliott Richmond Tabs Animation» كودى ئوچۇق يۇمشاق دېتال. تۆۋەندىكى كىشىلەر بۇ قىستۇرمىغا تۆھپە قوشقان.
تۆھپىكار
«Elliott Richmond Tabs Animation» نى تىلىڭىزغا تەرجىمە قىلىڭ
ئىجادىيەتكە قىزىقامسىز؟
كودقا كۆز يۈگۈرتۈپ، SVN خەزىنە تەكشۈرۈپ ياكى RSSئارقىلىق ئىجادىيەت خاتىرىسىگە مۇشتەرى بولغىلى بولىدۇ.
ئۆزگىرىش خاتىرىسى
0.1.0
- Initial release.
0.2.0
- Updated assets.
- Included screenshot.