Improved focus trapping. Focus trapping now also happens backwards.

This commit is contained in:
Frank419 2024-08-28 10:13:28 +08:00
parent 2067cd62f8
commit 36b1de5efc
3 changed files with 10 additions and 1 deletions

View File

@ -89,6 +89,7 @@ $label = get_theme_mod( 'minimalistflex_header_label' );
</h1>
<?php endif; ?>
<div class="spacer"></div>
<a id="minimalistflex-menu-focus-hack-2" href="#minimalistflex-menu-focus-hack-2" aria-label="<?php esc_attr_e( 'This element sends you to the last menu item.', 'minimalistflex' ) ?>"></a>
<?php if ( has_nav_menu( 'main-menu' ) ): ?>
<button id="menu-toggle" aria-label="<?php esc_attr_e( 'Toggle navigation dropdown', 'minimalistflex' ) ?>">
<i id="menu-toggle-icon"></i>

View File

@ -15,4 +15,7 @@ jQuery(document).ready(function($){
$("#minimalistflex-menu-focus-hack").focus(function(){
$("#menu-toggle").focus()
})
$("#minimalistflex-menu-focus-hack-2").focus(function(){
$(".minimalistflex-menu").find(".menu-item:last").children("a").focus()
})
})

View File

@ -356,7 +356,8 @@ a[target=_blank]::before {
margin-top: 0.5em;
}
#minimalistflex-menu-focus-hack {
#minimalistflex-menu-focus-hack,
#minimalistflex-menu-focus-hack-2 {
display: none;
}
@ -1518,6 +1519,10 @@ a img.alignwide {
display: inline;
}
.active #minimalistflex-menu-focus-hack-2 {
display: inline;
}
.minimalistflex-menu ul {
flex-direction: column;
}