Lightbox Component and IE 6 & 7 Compatibility

Richard Schwerdtfeger schwer at us.ibm.com
Mon Jul 2 17:51:33 UTC 2007


Hi Michael,

If I didn't understand your question please let me know. ... I think this
addresses you are asking:

If you make incremental changes to the page (small DOM udpates) the focus
does not move any more than a typical tabindex.

Focus only moves if the user moves focus. If the focus moves such as you
pop up a menu, move focus to it, and wish it to move back you will need to
keep track of where the focus was before the menu  was popped up. I Dojo, I
believe there is page focus management built in to handle this situation.

If you reload a page you have a "new document" and focus starts at wherever
the page designates.

If you want a page reload to maintain a point of regard you might consider
using AJAX to stash this information on the server for later retrieval at
onload time.

Rich


Rich Schwerdtfeger
Distinguished Engineer, SWG Accessibility Architect/Strategist
Chair, IBM Accessibility Architecture Review  Board
blog: http://www.ibm.com/developerworks/blogs/page/schwer


                                                                           
             Michael S Elledge                                             
             <elledge at msu.edu>                                             
                                                                        To 
             07/02/2007 12:14          Richard                             
             PM                        Schwerdtfeger/Austin/IBM at IBMUS      
                                                                        cc 
                                       fluid-work-bounces at fluidproject.org 
                                       , fluid-work at fluidproject.org       
                                                                   Subject 
                                       Re: Lightbox Component and IE 6 & 7 
                                       Compatibility                       
                                                                           
                                                                           
                                                                           
                                                                           
                                                                           
                                                                           




Hi Rich--

Does tabindex= -1 return the focus to its starting point? For example,
if focus is on a text field, is it possible for the focus to return
there after a return trip to the server or DOM has added new content? Or
is that better accomplished some other way?

Mike

Richard Schwerdtfeger wrote:
>
> Hi Johnathan,
>
> 1. That is not true. You need to set the tabindex=-1 or 0 depending on
> your application. You don't want to use anchors as this places things
> on the taborder.
>
> See http://www.w3.org/wai/pf/roadmap for the tabindex definitons.
>
> The Dojo toolkit is using tabindex extensively as described above.
>
> So when you set tabindex="-1" you can use JavaScript to set the focus
> on the element and it will not appear in the tab order. If you set it
> to "0" it will appear in the taborder in the document order it resides.
>
> This works in IE 6, 7, FF >= 1.5, and Opera 9.
>
> Rich
>
>
>
>
> Rich Schwerdtfeger
> Distinguished Engineer, SWG Accessibility Architect/Strategist
> Chair, IBM Accessibility Architecture Review Board
> blog: http://www.ibm.com/developerworks/blogs/page/schwer
> Inactive hide details for "Jonathan Hung"
> <jonathan.hung at utoronto.ca>"Jonathan Hung" <jonathan.hung at utoronto.ca>
>
>
>                         *"Jonathan Hung" <jonathan.hung at utoronto.ca>*
>                         Sent by: fluid-work-bounces at fluidproject.org
>
>                         06/20/2007 12:57 PM
>
>
>
> To
>
> fluid-work at fluidproject.org
>
> cc
>
>
> Subject
>
> Re: Lightbox Component and IE 6 & 7 Compatibility
>
>
>
>
> Hello everyone,
>
> We've continued our investigation into IE compatibility with the
> Lightbox component focusing on some of the problem areas we
> experienced earlier:
>
> 1. DIV focus doesn't work on IE
> 2. JSUnit 2.2a may not be compatible with Dojo
>
> *
> #1 Div Focus:*
>
> IE 6 & 7 follows the DOM 1.0 and 2.0 spec in that it will not focus
> any element that is not a form element (checkbox, radio button etc.)
> or an anchor. With this in mind, we changed the Lightbox Javascript to
> put focus on the anchor inside the first thumbnail by using tabindex.
> This required dynamically changing the tabindex each time the user
> moved around the Lightbox so that onblur returning to the Lightbox
> would maintain what was last selected.
>
> However dynamically changing the tabindex via Javascript would create
> unexpected tabbing orders if the user first focuses on another
> component on the UI. Also Firefox created some strange behaviour by
> not styling components properly after we modified tab index.
>
> All of this experimentation stems from the fact that IE does not allow
> focusing of DIVs (as per DOM spec). In a quick experiment, we tried
> the MochiKit Javascript Toolkit and it appears that MochiKit's event
> handling captures DIV focus event, even if the Browser does not. So
> it's a possibility that we can use MochiKit instead.
>
> We will continue investigating Dojo's event handling to see if it is
> capable of capturing DIV focus events in a browser independent manner.
> */
> !! None of this code has been committed to SVN since it was all
> experimental and the tests did not pass.
>
> /*
> *
> #2 JSUnit 2.2a may not be compatible with Dojo*
>
> JSUnit 2.2a now works with Dojo in IE. This is no longer an issue.
>
>
> Feel free to post questions/comments to this thread!
>
> - Jonathan.
>
>
> On 13/06/07, *Jonathan Hung* <_jonathan.hung at utoronto.ca_
> <mailto:jonathan.hung at utoronto.ca>> wrote:
>
>       During some recent testing, we have discovered that the Lightbox
>       component is not completely functional in Internet Explorer.
>       From a User Experience perspective the component is buggy in IE,
>       though in certain circumstances it /can /work the way we expect,
>
>       The following are the issues we've encountered in the past week:
>       *
>       1. DIV focus*
>       Currently in Firefox 2+, when you tab to the Lightbox component
>       the first thumbnail would become selected to indicate that the
>       user can perform actions on the thumbnails. However in IE 6 & 7
>       focusing on that DIV is inconsistent and therefore causing the
>       resulting arrow and CTRL key actions to not work.
>
>       If you're interested in more detail and how to get the component
>       to work in IE before we get a fix in place, please let me know.
>       This is a UX problem in IE and we are currently investigating
>       solutions.
>       *
>       2. JSUnit tests do not run in IE 6 & 7 if Javascript test code
>       is located in a seperate file.*
>       Currently the Lightbox unit test is separated into two files:
>       LightboxTests.html and LightboxTests.js. With all the test
>       Javascript code in the LightboxTests.js file, JSUnit will not
>       execute the tests in Internet Explorer 6 & 7.
>
>       One way to overcome this is to copy the contents of
>       LightboxTests.js into LightboxTests.html. There may be another
>       solution, but more research is required. Ideally we would like
>       to have our test Javascripts residing in a separate file for
>       maintainability and separation of function.
>       *
>       3. JSUnit 2.2a may be incompatible with Dojo*
>       During our testing, we discovered that JSUnit 2.2 Alpha (latest
>       downloadable release) is not compatible with IE 7. Attempting to
>       run the tests will yield "dijit is undefined" or "fluid is
>       undefined" errors. JSUnit 2.1 (the last stable release) appears
>       to work as expected with IE7. A solution would be to use version
>       JSUnit 2.1 instead of JSUnit 2.2 for our testing.
>       *
>       4. Lightbox component will only work for IE 7 if served from
>       Tomcat *
>       IE 7's security features prevent our component from being loaded
>       directly from the hard drive. Therefore the component needs to
>       be deployed into Tomcat and served up. The obvious disadvantage
>       to this is that IE 7 testing will require users to have Tomcat
>       installed. Luckily if you are testing just the component, you
>       don't need to have any Sakai running which can speed things up
>       considerably.
>
>
>       With this in mind, if you are planning on demoing the component,
>       try to use Firefox 2.0+ if possible. If using IE 6 or 7 is
>       absolutely critical, please let me know and I'll walk you
>       through the process to get it working.
>
>       We are currently doing research and testing various solutions.
>       Getting Lightbox working in IE is very important (goes without
>       saying) so we hope to get the most critical issues resolved soon.
>
>       Questions? Comments? Need more detail? Let us know!
>
>       Take care,
>
>       - Jonathan.
>
>       --
>       Jonathan Hung / _jonathan.hung at utoronto.ca_
>       <mailto:jonathan.hung at utoronto.ca>
>       University of Toronto - ATRC
>       Tel: (416) 946-8312
>
>
>
>
> --
> Jonathan Hung / _jonathan.hung at utoronto.ca_
> <mailto:jonathan.hung at utoronto.ca>
> University of Toronto - ATRC
> Tel: (416) 946-8312 _______________________________________________
> fluid-work mailing list
> fluid-work at fluidproject.org
> http://fluidproject.org/mailman/listinfo/fluid-work
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> fluid-work mailing list
> fluid-work at fluidproject.org
> http://fluidproject.org/mailman/listinfo/fluid-work
>
(See attached file: elledge.vcf)
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://fluidproject.org/pipermail/fluid-work/attachments/20070702/dcd6c394/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: graycol.gif
Type: image/gif
Size: 105 bytes
Desc: not available
URL: <http://fluidproject.org/pipermail/fluid-work/attachments/20070702/dcd6c394/attachment.gif>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: pic15058.gif
Type: image/gif
Size: 1255 bytes
Desc: not available
URL: <http://fluidproject.org/pipermail/fluid-work/attachments/20070702/dcd6c394/attachment-0001.gif>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: ecblank.gif
Type: image/gif
Size: 45 bytes
Desc: not available
URL: <http://fluidproject.org/pipermail/fluid-work/attachments/20070702/dcd6c394/attachment-0002.gif>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: elledge.vcf
Type: application/octet-stream
Size: 2 bytes
Desc: not available
URL: <http://fluidproject.org/pipermail/fluid-work/attachments/20070702/dcd6c394/attachment.obj>


More information about the fluid-work mailing list