jquerytools/jquerytools — Issue #630: Overlay mask does not prevent keyboard interaction with underlying elements
Author: ecellingsworth
Created: 2012-01-23 03:56:15+00:00
State: open

It is my understanding that modal dialogs should prevent all interaction with their parent document. When using the jQuery Tools Overlay combined with the Mask feature it is impossible to interact with underlying elements using the mouse, but perfectly possible to tab to underlying links and form elements using the keyboard. I discovered this with jQuery 1.7.1 and jQuery Tools 1.2.4 but the effect can currently be reproduced from the modal dialog demo on the website (http://flowplayer.org/tools/demos/overlay/modal-dialog.html). To reproduce:

1. load the demo site
2. click one of the buttons in the demo, the overlay will load and mask the underlying page
3. press the 'tab' key to navigate to links on the underlying page
4. in Firefox and Chrome, the link targets are displayed at the bottom of the document, follow a link by pressing the enter key

This works for element that can be tabbed to.