how to give embedded flash content keyboard focus straight away?

tidybox

unread,

Nov 7, 2011, 4:09:00 PM11/7/11

to SWFObject

I have an HTML page with only a single flash object on it which is
embedded using the 2.1 swfObject "Dynamic" generator and I want to be
able to use the keyboard straight away without the user first having
to click on the flash movie first! Can anyone advise me what code I
should use and where should it be placed in the generated HTML??

Thanks

Aran Rhee

unread,

Nov 7, 2011, 4:20:09 PM11/7/11

to swfo...@googlegroups.com

Have a read of my reply to this question in this thread:

http://groups.google.com/group/swfobject/msg/b0dc02d06db7aa43?hl=en_US

That in my opinion is the correct way to do it (as you can ensure the focus (and defocus) calls work as intended)

A simpler way which works in *most* browsers is to call a function on page load. Set the name and id in your attributes object for your embedSWF() call, and then call the focus method once all the page content had loaded.

<head>

function setFocus()

{

document.getElementById('myflashid').focus();

}

</script>

...

</head>

Aran

--
You received this message because you are subscribed to the Google Groups "SWFObject" group.
To post to this group, send email to swfo...@googlegroups.com.
To unsubscribe from this group, send email to swfobject+...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/swfobject?hl=en.

tidybox

unread,

Nov 7, 2011, 5:33:18 PM11/7/11

to SWFObject

Thanks for the quick response and I have tried both your suggestions
but still not working!
I'm not the best at coding and my original code doesn't seem to
reflect your suggestions so maybe I'm altering it incorrectly (I used
the air swfObject2 generator)!
Here is my HTML code before adding any of your stuff and maybe you can
point me in the right direction as to where to place the new code.

Much appreciated

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Portfolio</title>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {};
params.menu = "false";
params.quality = "best";
params.salign = "tl";
params.bgcolor = "#F7ECDA";
var attributes = {};
attributes.id = "swfContent";
swfobject.embedSWF("VendMach.swf", "flashDiv", "1152", "864",
"9.0.0", "expressInstall.swf", flashvars, params, attributes);
</script>
<style type="text/css" media="screen">
object { outline:none; }

</style>
<meta name="Keywords" content="Graphic Designer, Graphic Design,
Photoshop, illustrator, animation, print work, design, inDesign,
freelance" />
<meta name="Description" content="MyPortfolio, freelance graphic
designer" />
</head>
<body>
<div id="flashDiv">
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/
get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</div>
</body>
</html>

____________________________________________________________________

Alex Harui

unread,

Nov 7, 2011, 5:54:53 PM11/7/11

to swfo...@googlegroups.com

Which browser and version of the browser? I am under the impression that
the focus() call doesn't work on all browsers.

--
Alex Harui
Flex SDK Team
Adobe System, Inc.
http://blogs.adobe.com/aharui

Aran Rhee

unread,

Nov 7, 2011, 5:56:48 PM11/7/11

to swfo...@googlegroups.com

So if you are not proficient at coding then the simpler option I suggested will be the way to go.

steps to get it working:

1) get both id/name correct in the attibutes object:

var attributes = {};
attributes.id = "swfContent";

attributes.name = "swfContent";

2) define focus function within <head> section which matches your id you set for your swf:

function setFocus()

{

document.getElementById('swfContent').focus();

}

</script>

3) call focus function in your <body> tag:

(BTW - this is not a general forum, and you will get better help on a regular Flash forum etc. I am just answering this one as it had come up recently before)

Cheers,

Aran

Aran Rhee

unread,

Nov 7, 2011, 6:02:58 PM11/7/11

to swfo...@googlegroups.com

@Alex - Using the ExternalInterface methodology of calling focus from within the swf after it is rendered etc (as described in my first response) worked in all recent versions of FF/Safari/IE/Chrome/Opera that I tested.

Setting the tab index seemed to fix the focus issue on some versions.

In my situation, I needed not only to focus the swf on page load (kiosk app driven by keyboard / remote control), but needed to be able to defocus the Flash so the swap browser tab shortcut worked on FF as well... It was pretty annoying to get working, but boiled down to some pretty simple functions in the end...

Cheers,

Aran

Philip Hutchison

unread,

Nov 7, 2011, 6:19:23 PM11/7/11

to swfo...@googlegroups.com

Traditionally, only links and form controls can receive focus. Since <object> is not a link or form element, it isn't capable of receiving focus in most browsers unless you set its tabIndex property.

Jonathan Snook wrote a nice overview about focus and tabIndex a while back:

http://snook.ca/archives/accessibility_and_usability/elements_focusable_with_tabindex

The MDN has a good overview of the topic as well:

https://developer.mozilla.org/en/Accessibility/Keyboard-navigable_JavaScript_widgets

W3C's word on the topic (as relates to ARIA):

http://www.w3.org/WAI/PF/aria-implementation/#keyboard-focus_tabindex

As far as it relates to SWFObject, I'd invoke focus() using SWFObject's callback function since it doesn't involve editing the SWF:

var flashvars = {};

var params = { menu: false, salign: "tl", bgcolor: "#F7ECDA" };

var attributes = { id: "swfContent" };

var callbackFn = function(e){

if(e.success){

e.ref.tabIndex = "-1";

e.ref.focus();

}

};

swfobject.embedSWF("VendMach.swf", "flashDiv", "1152", "864",

"9.0.0", "expressInstall.swf", flashvars, params, attributes, callbackFn);

</script>

By the way, setting params.quality = "best" is not necessary -- "best" is Flash's default setting.

- philip

Aran Rhee

unread,

Nov 7, 2011, 6:46:58 PM11/7/11

to swfo...@googlegroups.com

@Philip.

Thanks for your input / background articles.

Unfortunately in my own recent findings, using the callback function provided by SWFObject still fails to focus the element correctly in a bunch of browsers (my hypothesis is that it is still too early to be able to focus correctly)

I agree that this would have been a really nice clean way to make it happen (if it had worked)

A

Philip Hutchison

unread,

Nov 7, 2011, 7:19:11 PM11/7/11

to swfo...@googlegroups.com

Nothing is ever as easy as it should be, no? :)

Hmm... perhaps focus will only work when the SWF has completed loading, which may be why your ExternalInterface and body onload approaches both work. If that's the case, you could still set focus using the callback, but it gets a bit more complicated. You could use a timer as described here.

Probably simpler to use static publishing with an swfobject.addLoadEvent call, though.

I think I'll make some test pages for this when I can find time...

Aran Rhee

unread,

Nov 7, 2011, 7:44:25 PM11/7/11

to swfo...@googlegroups.com

Static publishing + callback could be interesting. I was only looking at dynamic publishing...

(checking loading % through js with a timer seems like a worse hack than using EI :)

A

Alex Harui

unread,

Nov 7, 2011, 8:03:25 PM11/7/11

to swfo...@googlegroups.com

@Aran,

That’s good news that it is starting to work in more and more browsers. I’m just wondering if this user is still on an older browser.

-Alex

On 11/7/11 10:02 AM, "Aran Rhee" <aran...@gmail.com> wrote:

@Alex - Using the ExternalInterface methodology of calling focus from within the swf after it is rendered etc (as described in my first response) worked in all recent versions of FF/Safari/IE/Chrome/Opera that I tested.

Setting the tab index seemed to fix the focus issue on some versions.

In my situation, I needed not only to focus the swf on page load (kiosk app driven by keyboard / remote control), but needed to be able to defocus the Flash so the swap browser tab shortcut worked on FF as well... It was pretty annoying to get working, but boiled down to some pretty simple functions in the end...

Cheers,
Aran

On Mon, Nov 7, 2011 at 11:54 AM, Alex Harui <aha...@adobe.com> wrote:

Which browser and version of the browser? I am under the impression that
the focus() call doesn't work on all browsers.

On 11/7/11 9:33 AM, "tidybox" <tid...@hotmail.co.uk> wrote:

> Thanks for the quick response and I have tried both your suggestions
> but still not working!
> I'm not the best at coding and my original code doesn't seem to
> reflect your suggestions so maybe I'm altering it incorrectly (I used
> the air swfObject2 generator)!
> Here is my HTML code before adding any of your stuff and maybe you can
> point me in the right direction as to where to place the new code.
>
> Much appreciated
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://

> www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd <http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd> ">

> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
> <head>
> <title>Portfolio</title>
> <meta http-equiv="Content-Type" content="text/html;
> charset=ISO-8859-1" />
> <script type="text/javascript" src="swfobject.js"></script>
> <script type="text/javascript">
> var flashvars = {};
> var params = {};
> params.menu = "false";
> params.quality = "best";
> params.salign = "tl";
> params.bgcolor = "#F7ECDA";
> var attributes = {};

> attributes.id <http://attributes.id> = "swfContent";

>>> swfobject+...@googlegroups.com <mailto:swfobject%2Bunsu...@googlegroups.com> .

>>> For more options, visit this group at
>>> http://groups.google.com/group/swfobject?hl=en.

--
Alex Harui
Flex SDK Team
Adobe System, Inc.
http://blogs.adobe.com/aharui

--
You received this message because you are subscribed to the Google Groups "SWFObject" group.
To post to this group, send email to swfo...@googlegroups.com.

To unsubscribe from this group, send email to swfobject+...@googlegroups.com <mailto:swfobject%2Bunsu...@googlegroups.com> .

For more options, visit this group at http://groups.google.com/group/swfobject?hl=en.

Philip Hutchison

unread,

Nov 7, 2011, 8:09:05 PM11/7/11

to swfo...@googlegroups.com

I agree EI is cleaner, but not everyone has access to the FLA.

To unsubscribe from this group, send email to swfobject+...@googlegroups.com.

tidybox

unread,

Nov 8, 2011, 12:45:48 PM11/8/11

to SWFObject

Guys, thanks for the responses I'll try working through all your
suggestions and see what I can get to work!
@Alex - as far as I am aware I'm using Chrome 15.0.874.106, Firefox
7.0.1 and Opera 9.64 which are supposed to all be up to date, I am
running OS X 10.5.8 on an iMac so all should be good?!

On Nov 7, 8:03 pm, Alex Harui <aha...@adobe.com> wrote:
> @Aran,
>
> That’s good news that it is starting to work in more and more browsers. I’m just wondering if this user is still on an older browser.
>
> -Alex
>

> On 11/7/11 10:02 AM, "Aran Rhee" <aran.r...@gmail.com> wrote:
>
> @Alex - Using the ExternalInterface methodology of calling focus from within the swf after it is rendered etc (as described in my first response) worked in all recent versions of FF/Safari/IE/Chrome/Opera that I tested.
>
> Setting the tab index seemed to fix the focus issue on some versions.
>
> In my situation, I needed not only to focus the swf on page load (kiosk app driven by keyboard / remote control), but needed to be able to defocus the Flash so the swap browser tab shortcut worked on FF as well... It was pretty annoying to get working, but boiled down to some pretty simple functions in the end...
>
> Cheers,
> Aran
>
> On Mon, Nov 7, 2011 at 11:54 AM, Alex Harui <aha...@adobe.com> wrote:
>
> Which browser and version of the browser? I am under the impression that
> the focus() call doesn't work on all browsers.
>

> Adobe System, Inc.http://blogs.adobe.com/aharui

>
> --
> You received this message because you are subscribed to the Google Groups "SWFObject" group.
> To post to this group, send email to swfo...@googlegroups.com.
> To unsubscribe from this group, send email to swfobject+...@googlegroups.com <mailto:swfobject%2Bunsu...@googlegroups.com> .

> For more options, visit this group athttp://groups.google.com/group/swfobject?hl=en.

marcelozep

unread,

Mar 22, 2012, 1:30:50 AM3/22/12

to swfo...@googlegroups.com

Hi.

I think that using ExternalInterface methodology of calling focus may give flash focus, but doesn´t gives flash keyboard focus. I mean, I have an input text field in my flash movie that receives focus, when loading on Chrome 17.0.963.79 m, but I can´t write/type anything.

Cheers,
Aran

>>> swfobject+unsubscribe@googlegroups.com.

>>> For more options, visit this group at
>>> http://groups.google.com/group/swfobject?hl=en.

--

Alex Harui
Flex SDK Team
Adobe System, Inc.
http://blogs.adobe.com/aharui

--
You received this message because you are subscribed to the Google Groups "SWFObject" group.
To post to this group, send email to swfo...@googlegroups.com.

To unsubscribe from this group, send email to swfobject+unsubscribe@googlegroups.com.

marcelozep

unread,

Mar 22, 2012, 1:41:07 AM3/22/12

to swfo...@googlegroups.com

Hi. Using the ExternalInterface methodology of calling focus may give flash focus, but not keyboard focus. I mean, I have a flash movie with a text input that receives browser focus, but I can´t write/type anything. If I press any key, won´t write/type anything on input text.

On Monday, November 7, 2011 4:02:58 PM UTC-2, Misterhee wrote:

Cheers,
Aran

>>> swfobject+unsubscribe@googlegroups.com.

>>> For more options, visit this group at
>>> http://groups.google.com/group/swfobject?hl=en.

--

Alex Harui
Flex SDK Team
Adobe System, Inc.
http://blogs.adobe.com/aharui

--
You received this message because you are subscribed to the Google Groups "SWFObject" group.
To post to this group, send email to swfo...@googlegroups.com.

To unsubscribe from this group, send email to swfobject+unsubscribe@googlegroups.com.

Aran Rhee

unread,

Mar 22, 2012, 3:36:08 AM3/22/12

to swfo...@googlegroups.com

Flash will trap keys as soon as it has focus. (you can test this by initializing a key listener object and outputing the results when you press keys). My specific app which I needed to get this working on was keyboard driven only, so I know 1st hand that it does work...

However, just because the Flash movie has focus (and is listening to keys) does not mean any specific component within your swf has focus.

You can set focus on a input field by calling my_ti.setFocus();

If you are using EI, then you can call a Flash EI function after giving focus through js and focus the component from within Flash as required.

Cheers,
Aran

To view this discussion on the web visit https://groups.google.com/d/msg/swfobject/-/VkrosqCQnvYJ.

To post to this group, send email to swfo...@googlegroups.com.

To unsubscribe from this group, send email to swfobject+...@googlegroups.com.

Reply all

Reply to author

Forward