Make WordPress Core

Changes between Initial Version and Version 4 of Ticket #55143


Ignore:
Timestamp:
09/15/2022 11:02:25 PM (2 years ago)
Author:
joedolson
Comment:

I don't think so, although it's related.

Legend:

Unmodified
Added
Removed
Modified
  • Ticket #55143

    • Property Keywords reporter-feedback added
    • Property Component changed from Themes to Bundled Theme
  • Ticket #55143 – Description

    initial v4  
    22https://github.com/joedolson/my-calendar/issues/374
    33
    4 "Twenty Twenty One contains code that intercepts all anchor links containing a '#' and moves scroll position to that link. This causes an undesirable focus position movement for popups.
     4Twenty Twenty One contains code that intercepts all anchor links containing a '#' and moves scroll position to that link. This causes an undesirable focus position movement for any link containing a '#' character that is not intended to move focus.
    55
    6 Not sure there's a viable way around this other than switching the popup trigger to a button, which creates a significant new burden in formatting."
     6```
     7        /**
     8                 * Close menu and scroll to anchor when an anchor link is clicked.
     9                 * Adapted from Twenty Twenty.
     10                 *
     11                 * @since Twenty Twenty-One 1.1
     12                 */
     13                document.addEventListener( 'click', function( event ) {
     14                        // If target onclick is <a> with # within the href attribute
     15                        if ( event.target.hash && event.target.hash.includes( '#' ) ) {
     16                                wrapper.classList.remove( id + '-navigation-open', 'lock-scrolling' );
     17                                twentytwentyoneToggleAriaExpanded( mobileButton );
     18                                // Wait 550 and scroll to the anchor.
     19                                setTimeout(function () {
     20                                        var anchor = document.getElementById(event.target.hash.slice(1));
     21                                        anchor.scrollIntoView();
     22                                }, 550);
     23                        }
     24                } );
     25```
    726
     27This code adds a listener to all links that scrolls to that target anchor. For any case where a link is used to open a modal, an accordion, or as a faux-button in any way while containing a hash character, this will cause problems.
     28