Making WordPress.org

Changeset 10453


Ignore:
Timestamp:
11/18/2020 05:52:35 PM (4 years ago)
Author:
ryelle
Message:

WordPress.org Main: Manage focus in download modal.

Move focus into modal when opened, and back to download button when modal is closed. This doesn't prevent tabbing out of the modal, but at least lets keyboard users get to the links in the modal. This also fixes some jshint issues.

Location:
sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main/js/page-download.js

    r9374 r10453  
    11( function( $ ) {
    2     jQuery('#download-wordpress').click( function(e) {
     2    $('#download-wordpress').click( function() {
    33        this.blur();
    4         jQuery('#after-download').modal();
     4        $('#after-download').modal();
     5    } );
     6    // Move focus into modal
     7    $('#after-download').on($.modal.OPEN, function() {
     8        $( this ).focus();
     9    } );
     10    // Move focus back to download button
     11    $('#after-download').on($.modal.AFTER_CLOSE, function() {
     12        $('#download-wordpress').focus();
    513    } );
    614} )( window.jQuery );
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-main/page-download.php

    r9689 r10453  
    130130            <div class="entry-content row">
    131131
    132                 <div id="after-download" class="modal" role="dialog" aria-modal="true">
     132                <div id="after-download" class="modal" role="dialog" aria-modal="true" tabindex="0">
    133133                    <div role="document">
    134134                        <header class="entry-header">
Note: See TracChangeset for help on using the changeset viewer.