« Music: Tenori-On details
Flash and Ajax History Support in Safari? »


Flash: tabIndex and IE workaround

June 13th, 2006 by Luis

Problem:

In Internet Explorer after the last tabIndex, focus goes to the browser address bar.

Solution:

An easy workaround is to create an empty MovieClip which receives keyboard focus and automatically gives focus to the first selectable (editable) text field, button, or movie clip.

Example:

[flash]http://www.blog.lessrain.com/wp-content/upload/test_01.swf,250,100[/flash]

PLAIN TEXT
Actionscript:
  1. import mx.utils.Delegate;
  2.  
  3. var timeline:MovieClip = this;
  4.  
  5. var myformat:TextFormat = new TextFormat ();
  6. myformat.font = "Verdana";
  7. myformat.size = 10;
  8.  
  9. var tf1:TextField = timeline.createTextField ("tf1", this.getNextHighestDepth (), 10, 10, 200, 18);
  10. tf1.type = "input";
  11. tf1.selectable = true;
  12. tf1.border = true;
  13. tf1.setTextFormat (myformat);
  14.  
  15. var tf2:TextField = timeline.createTextField ("tf2", this.getNextHighestDepth (), 10, 40, 200, 18);
  16. tf2.type = "input";
  17. tf2.selectable = true;
  18. tf2.border = true;
  19. tf2.setTextFormat (myformat);
  20.  
  21. tf1.tabIndex = 0;
  22. tf2.tabIndex = 1;
  23.  
  24. var tabHackMC:MovieClip = timeline.createEmptyMovieClip ("tabHackMC", timeline.getNextHighestDepth ());
  25. tabHackMC.tabIndex = 2;
  26. tabHackMC.onSetFocus = Delegate.create (this, focusLast);
  27. function focusLast ():Void
  28. {
  29.     Selection.setFocus ("timeline.tf1");
  30. }


This entry was posted on Tuesday, June 13th, 2006 at 9:58 am and is filed under General, Flash, Learnings. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

4 Responses to “Flash: tabIndex and IE workaround”

  1. ricardo cabello Says:
    June 13th, 2006 at 7:23 pm

    heh, clever!

  2. Vinayak Kadam Says:
    September 19th, 2006 at 6:40 am

    I wanted to implemnet the same thing in Flash MX 2004. I have encountered this problem and need the solution as uregnetly as it could be.

    Thanx,
    Vinayak
    vinayak.kadam@techbooks.com

  3. Bryan Taggart Says:
    October 6th, 2006 at 2:42 pm

    Or you could add the SeamlessTabbing property and set it to false.

  4. David Fox Says:
    November 17th, 2008 at 7:36 pm

    That’s a smart way to achieve this effect but actually, when using screen readers/tabbing etc, you WANT the user to be able to tab back into the browser. Otherwise, they’re “stuck” in your website with no way to get back into their location bar and visit another site. I talked with my company’s QA department and everyone seems to say that yes, officially a disabled person who could only navigate the web by tabbing has to be able to be able to get back to the location bar as easily as possible.

Leave a Reply