Difference between revisions of "Dialog Focus: Keep it modal"
Jump to navigation
Jump to search
Dialog Focus - Keeping focus inside modal dialogs.
Bbroughton (talk | contribs) (Demo how to retain focus within modal dialog until dismissed) |
Bbroughton (talk | contribs) |
||
| Line 32: | Line 32: | ||
var controls = modal.getElementsByClassName('modal-control'); | var controls = modal.getElementsByClassName('modal-control'); | ||
| − | function | + | function modalShift(e,f,g){ |
//handle focus between modal elements | //handle focus between modal elements | ||
//e - current element | //e - current element | ||
| Line 59: | Line 59: | ||
//middle controls | //middle controls | ||
for (var i=1,j=controls.length-1;i < j; i++){ | for (var i=1,j=controls.length-1;i < j; i++){ | ||
| − | + | modalShift(controls[i], controls[i+1], controls[i-1]); | |
} | } | ||
//first control | //first control | ||
| − | + | modalShift(controls[0], controls[1], controls[controls.length-1]); | |
//last control | //last control | ||
| − | + | modalShift(controls[controls.length-1], controls[0], controls[controls.length-2]); | |
function closeDialog() { | function closeDialog() { | ||
Revision as of 18:11, 30 March 2016
Dialog Focus - Keeping focus inside modal dialogs.
While the dialog is open, focus cannot move out of the dialog.
A control before the dialog Open the dialog A control after dialog