Problem



When you have a particularly long scrollbar category that scrolls well, but tends to freeze on other times (i.e. doesn't scroll to the bottom which results in the inability to click on certain submenu items unless you zoom out).


Diagnosis

Environment

  • Linchpin Suite 1.0.1 & newer & Linchpin Essentials 1.0 & newer

  • Confluence: 6.13.4 & newer

Diagnostic Steps

  1. Create a drop down menu with at least 14 submenu entries.
  2. Create an empty page.
  3. Open the created drop down menu while being on the empty page.
  4. Try to scroll through the 14 submenu entries.


Cause

The Confluence header is fixed in height. As the menu bar is attached to the header, the visibility of the submenu entries could be limited when the content of the page doesn't meet the combined minimum height of the header and menu element.

Workaround


 As it is not recommended to use very long dropdowns since there are disadvantages regarding usability and user experience, see Dropdowns: Design Guidelines (Point 3 in Guidelines for Dropdown Design):

Very long dropdowns that require scrolling make it impossible for users to see all their choices in one glance. They also require careful steering of the mouse so that it does not leave the dropdown. (This is an instance of the steering law, which says that the time it takes a user to steer a pointing device through a tunnel depends on the length and the width of the tunnel: the longer and narrower the tunnel, the more time it takes users to move the pointer from one end to another. The steering law is derived from Fitts’ law, which we discuss in our Human-Computer Interaction course.)

Resist the temptation to include many items whenever possible. If you have many items, consider alternative ways of presenting them — such as HTML lists of traditional links or mega menus, which are two dimensional instead of linear and offer easier mouse management and also faster average reach time to items inside.

   

Our recommendation therefore is to reconsider the need for the very long dropdown and try to restructure your menu in a more compact way.


Option one:

If you want to use a mega menu instead, which is more suitable for this case, you can switch to the Flyout or Extended Flyout display option. It places the submenu items differently.

Go to *Linchpin Navigation Menus > Menu Settings and select Extended flyout as Menu style.


Option two:

Since this issue only applies to pages and blog posts, where the Confluence header is fixed, you could disable the Confluence fixed header, so the header moves away by scrolling the page.

Follow these instructions:
        How to Disable Global Fixed Header in Confluence 5.9 and Above
        (Note that the name of the add-on might be "confluence-fixed-headers").



  • No labels
This page was last edited on 04/13/2023.