Skip to content

Sticky header does not reset when scrolling back to top after opening dropdown menu #1430

@Dnsftl

Description

@Dnsftl

Describe the bug
When using the sticky header in Astroid, the header does not properly reset to its normal state when scrolling back to the top if a dropdown menu was opened while the header was in sticky mode.

If a dropdown menu is opened while the header is sticky and the user scrolls back to the top without selecting a menu item, the header visually remains in sticky mode instead of returning to its original (non-sticky) layout.

However, as soon as the user clicks anywhere on the page, the header immediately returns to the normal layout. This suggests that the sticky state is not properly reset on scroll and is only updated after a click event.

This results in the header staying in a fixed/sticky state even when the page is at the top.

To Reproduce
Steps to reproduce the behavior:

  1. Go to a page with the Astroid sticky header enabled
  2. Scroll down until the header becomes sticky
  3. Open a dropdown menu in the navigation (for example "Over ons")
  4. Without selecting a menu item, scroll back up to the top of the page
  5. Observe that the header does not return to the normal header state
  6. Click anywhere on the page and the header immediately resets to the correct layout

Expected behavior
When the user scrolls back to the top of the page, the sticky header should reset to the original non-sticky header layout automatically, regardless of whether a dropdown menu was opened.

The header should behave exactly as it does on initial page load and should not require a click on the page to reset.

Screenshots
Normal header (page top)
Header appears correctly in its default layout.

Image

Image

Image

Sticky header with dropdown open

Header after scrolling back to top (bug)
The header remains visually in sticky mode instead of returning to the default layout.

System Informations (please complete the following information):

  • Joomla Version: 5.4.3
  • PHP Version: 8.3
  • Astroid Version: 3.3.11
  • Template: Jollyany 3.5.43
  • Device: Desktop (Laptop)
  • OS: Windows 11
  • Browser: Edge / Chrome (Chromium)

Additional context
The issue appears to be related to the sticky header state not being reset when a dropdown menu is opened during sticky mode. The layout seems to remain in the sticky state until a click event occurs somewhere on the page, which then forces the header to update to the correct state.

This behavior is consistently reproducible and does not depend on selecting a menu item. Simply opening the dropdown while the header is sticky and then scrolling back to the top triggers the issue.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions