Changeset 59911

Timestamp:

03/03/2025 08:06:03 PM (9 months ago)

Author:

joedolson

Message:

Bundled Themes: Twenty Twelve: Add ARIA attributes on menu toggle.

Add aria-expanded and aria-controls attributes to the Twenty Twelve mobile menu toggle.

Props bschneidewind, joedolson, sabernhardt, umeshsinghin.
Fixes #62892.

File:

• trunk/src/wp-content/themes/twentytwelve/js/navigation.js (modified) (2 diffs)

trunk/src/wp-content/themes/twentytwelve/js/navigation.js

@@ -21 +21 @@
     }
 
+    // Assign an ID for the default page list if no menu is set as Primary.
+    if ( ! menu.id ) {
+        menu.id = 'twentytwelve-page-list-menu';
+    }
+
+    button.setAttribute( 'aria-controls', menu.id );
+    button.setAttribute( 'aria-expanded', 'false' );
+
     button.onclick = function() {
         if ( -1 === menu.className.indexOf( 'nav-menu' ) ) {
@@ -27 +35 @@
 
         if ( -1 !== button.className.indexOf( 'toggled-on' ) ) {
+            button.setAttribute( 'aria-expanded', 'false' );
             button.className = button.className.replace( ' toggled-on', '' );
             menu.className = menu.className.replace( ' toggled-on', '' );
         } else {
+            button.setAttribute( 'aria-expanded', 'true' );
             button.className += ' toggled-on';
             menu.className += ' toggled-on';