Descrizione
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.
Screenshot
Installazione
- 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.
Recensioni
Contributi e sviluppo
“Elliott Richmond Tabs Animation” è un software open source. Le persone che hanno contribuito allo sviluppo di questo plugin sono indicate di seguito.
Collaboratori
Traduci “Elliott Richmond Tabs Animation” nella tua lingua.
Ti interessa lo sviluppo?
Esplora il codice segui il repository SVN, segui il log delle modifiche tramite RSS.
Changelog
0.1.0
- Initial release.
0.2.0
- Updated assets.
- Included screenshot.