| 开发者 | jamiemarsland |
|---|---|
| 更新时间 | 2026年10月9日 21:10 |
| PHP版本: | 7.4 及以上 |
| WordPress版本: | 7.1 |
| 版权: | GPLv2 or later |
| 版权网址: | 版权信息 |
prefers-reduced-motion.
It's theme-agnostic (it finds your header automatically, with an override selector for unusual themes), accessible, and ships no jQuery.
Settings: Appearance → Header Effects.
jamies-header-effects folder to /wp-content/plugins/, or install it from the Plugins screen.Any block theme. By default it looks for the header template part (header.wp-block-template-part, then the first header inside the site wrapper). If your theme is unusual, enter your own CSS selector in the Header selector field.
As you scroll, it looks at the section directly beneath the header, finds that section's background colour (including Cover blocks and their overlays), and applies it to the header at your chosen opacity. It then picks black or white text based on the colour's brightness so the header stays readable. Sections with no solid background (an image-only section, say) make the header transparent.
Yes. Offset for admin bar (on by default) positions the sticky header just below the admin bar when you're logged in.
Yes. Set a mobile breakpoint to disable it on small screens, and untick it for specific post types or templates (home, front page, blog, single, page, archive, 404, search) under Disable on.
"Push content down" adds space below the header so content starts beneath it. "Overlay page content" does the opposite: it floats the header over the first section, the classic transparent-hero look. If both are ticked, overlay wins.
Yes. If a visitor has asked their system to reduce motion, transitions are disabled and the hide-on-scroll animation is turned off.