Changes between Initial Version and Version 4 of Ticket #55143
- Timestamp:
- 09/15/2022 11:02:25 PM (2 years ago)
Legend:
- Unmodified
- Added
- Removed
- Modified
-
Ticket #55143
- Property Keywords reporter-feedback added
-
Property
Component
changed from
Themes
toBundled Theme
-
Ticket #55143 – Description
initial v4 2 2 https://github.com/joedolson/my-calendar/issues/374 3 3 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.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 any link containing a '#' character that is not intended to move focus. 5 5 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 ``` 7 26 27 This 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