PDA

Click to See Complete Forum and Search --> : Embeded Flash problems in IE7

ktomasso
08-21-2008, 01:56 PM
I've just finished a splash page that consists of a large SWF file and a footer. I used SWFobject to insert my Flash, and everything works perfect except for in IE7. When rolled over in this browser, a border appears over the SWF area, and a pop-up caption reads, 'click to activate and use this control.'

This would not be a problem normally, as the animation runs fine, but I have a <div> that sits on top of the Flash area that's used as a button. For this reason, I have used the "wmode" value=" opaque" and the z-index attribute to allow the button to lay in front of the SWF.

When you hover over the SWF area, a border appears around the area and it becomes clickable, disrupting a click on the overlapping button. If you click within the Flash area, it will anchor back to the top of the screen, and becomes "normal" again.

Any ideas? Again, this is only in IE7 from what I can gather.

A brief depiction of my code is below.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Problem in IE7</title>
<link href="splash_styles.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("progrphx", "8.0.0", "expressInstall.swf");
</script>
</head>

<body>
<div id="flash">
<object id="progrphx" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600">
<param name="movie" value="media/Progrphx_splash.swf" />
<param name="wmode" value="opaque" />

<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="media/Progrphx_splash.swf" width="800" height="600">
<param name="wmode" value="opaque" />

<!--<![endif]-->

<h1>content</h1>

<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
ryanbutler
08-21-2008, 02:21 PM
I might not be understanding your problem completely, but the only way I know of to get around that stupid "click here..." business if to use this script that I talk about in this article:

http://midwestwebdesign.net/tutorials/flash/faq/activecontent/index.aspx
ktomasso
08-21-2008, 03:00 PM
You definitely understood my problem exactly. Since your fix would require me (I think), to change the way my object was inserted (I was using SWFobject), I looked to see if I could find another fix.

I did find a few, many of which were short Javascript snippets similar to this: theObjects = document.getElementsByTagName("object");
for (var i = 0; i < theObjects.length; i++) {
theObjects[i].outerHTML = theObjects[i].outerHTML;
}

THIS DID NOT WORK FOR ME.

What DID fix the problem was following the directions on this link:
http://www.ediy.co.nz/click-to-activate-and-use-this-control-fix-for-internet-explorer-xidc20771.html

This allowed me to fix the problem without altering the way my SWF was inserted into my HTML document. I hope this helps anyone else with this problem.

Thanks for your help!