iOS voice over compatibility modal popup

Created on 20 June 2019, almost 6 years ago
Updated 12 February 2023, about 2 years ago

Hi guys,

I've came up the following issue recently while trying implement accessibility features for iOS voice over screen reader.

I've had to correct two issues when the screen reader was active:

1. when closing the modal popup the expected behaviour should be going back to the area/element (in this case addToAny buttons), instead it send the user on the top/bottom of the page depending on the direction that the user will virtually scroll
2. modal popup doesn't retain focus so it scrolls to the top/bottom of the page behind the modal popup, the expected behaviour should be letting the user scrolling just through the window that is presented on the front

The code that worked for me is the following, I had to tweak and edit using javascript what the "default" addToAny src is sending to the site.

\\keeps the focus inside the modal popup
var a2a_modal = document.getElementById('a2a_modal');
var a2apage_full = document.getElementById('a2apage_full');
a2apage_full.setAttribute('style', 'visibility:hidden');
$('.a2a_dd').on('click', function () {
var page_wrapper = document.getElementsByClassName('page-wrapper');
jQuery(page_wrapper).attr('aria-hidden', 'true');
a2apage_full.style.setProperty('visibility','visible');
a2a_modal.setAttribute('style', 'visibility:visible');
});
$('.close-a2a-modal').on('click', function (){
var page_wrapper = document.getElementsByClassName('page-wrapper');
jQuery(page_wrapper).attr('aria-hidden', 'false');
a2apage_full.style.setProperty('visibility','hidden');
a2a_modal.setAttribute('style', 'visibility:hidden');
});

For future references, the European union is getting all the state members to comply with some rules by September 2020. So, I'm wondering if this should be fixed and included within the module itself.

💬 Support request
Status

Active

Version

4.16

Component

User interface

Created by

🇬🇧United Kingdom gcerni London

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024