We have created a "modal" dialog box that limits the user's access to
the page beneath. However, a user can still tab through the page's
input and link elements. We've been asked to prevent this behavior
and force the tab order to cycle through only those inputs and links
visible on the dialog box. This is what I've done so far:
function showPopup(popUpId) {
... // irrelevent code ommitted
document.observe('focus', function(evt) {
var focusedElement = evt.element();
if (!focusedElement.descendantOf(popUpId) ) {
var targetElement = $(popUpId).down('input');
targetElement.focus();
targetElement.scrollTo();
}
});
$(popUpId).show();
}
This _almost_ works. Since it is observing the focus event, a link
underneath the overlay actually gets the focus. My code successfully
sets focus to the first input in the popup, then it scrolls to it.
This is when it breaks. The browser then scrolls down to the location
of the formerly focused link.
I've tried various combinations of Event.stop(), but I can't seem to
prevent this default behavior. Can anyone suggest a way to stop the
scroll or a better strategy for accomplishing this modal behavior?
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
