Checker interface covers Back To Top module widget

Created on 15 April 2025, 9 days ago

Problem/Motivation

When using the https://www.drupal.org/project/back_to_top β†’ module configured to trigger with zero or positive number and placed in the bottom right, the Editoria11y checker tool covers the Back To Top widget if you are not already scrolled down the page when loading. Probably due to how the Back To Top widget fades in with JS changing the inline style (style="display: none;) as you scroll down from the top.

Using Editoria11y's "Don't cover these other widgets" option set to #backtotop doesn't help since Back To Top fades in. Setting a negative trigger for Back To Top seems to prevent the fade in functionality and then Editoria11y & Back To Top play nice together.

Steps to reproduce

  1. Install Back to Top module & Editoria11y
  2. Configure Back to Top to trigger with a non-negative number and set placement to bottom right.
  3. Optionally configure Editoria11y's "Don't cover these other widgets" setting to include #backtotop
  4. Scroll a content page in the front end theme where both Editoria11y and Back to Top display.
  5. Notice that the widgets overlap

Proposed resolution

Investigate whether anything can be done given Back To Top's fade in / fade out functionality implementation.

Remaining tasks

Determine whether this should be fixed in Editoria11y or Back To Top?

User interface changes

API changes

Data model changes

✨ Feature request
Status

Active

Version

2.2

Component

Conflicts with other modules

Created by

πŸ‡ΊπŸ‡ΈUnited States timwood Rockville, Maryland

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @timwood
  • πŸ‡ΊπŸ‡ΈUnited States itmaybejj

    Indeed.

    I think the best thing here because of the late fade-in is to use CSS to move the back to top widget instead, so you don't get a weird floatie-thing going where Editoria11y is sorta vaguely centered before the other widget appears. Something like:

    body:has(ed11y-element-panel) #backtotop {
      margin-right: 140px;
    }
    

    I'm a little loathe to add that sort of thing in my module, since I'd be moving their widget; might be good to ask Back to Top to add an offset parameter?

Production build 0.71.5 2024