There are several sites available detailing how to embed SWF Object's into your sites. By far the most reliable, and cross browser compatible without writing any form of Internet Explorer / Firefox hack is the SWF Object javascript plugin.
Adobe have a Developer Connection article detailing how the SWF Object javascript plugin works, http://www.adobe.com/devnet/flashplayer/articles/swfobject.html but it is six pages long, and seems to avoid any direct example of the most straight forward method of implementation. I am sure that it is all encompassing, but I was looking for a quick bullet point style guide.
So here it is:
1. Include the call to the Swobject Javascript library, don't host this yourself, just link directly to Google's code base.
ColdFISH is developed by Jason Delmore. Source code and license information available at coldfish.riaforge.org
<s cript type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></s cript>
1<s cript type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></s cript>
2. Setup the flash variable scopes, this ensures that they exist, and it is a handly place to set global variables for your flash. I normally include this in the header of my frameworks.
ColdFISH is developed by Jason Delmore. Source code and license information available at coldfish.riaforge.org
<s cript type="text/javascript">
var flashvars = {};
var attributes = {};
var params = {wmode: "transparent", allowFullScreen: "true"};
</s cript>
1<s cript type="text/javascript">
2 var flashvars = {};
3 var attributes = {};
4 var params = {wmode: "transparent", allowFullScreen: "true"};
5</s cript>
3. Setup a div for your flashcontent. This is what will be displayed if you are not flash enabled. Ensure that your "No Flash content" either closely represents the actual flash content, or signifies a link to getting Adobe flash in some way.
ColdFISH is developed by Jason Delmore. Source code and license information available at coldfish.riaforge.org
<div id="flashcontent">
<a href="http://get.adobe.com/flashplayer/" target="new_window" title="Follow this link to get Adobe Flash player"><img src="flash_no_content.jpg" alt="Follow this link to get Adobe Flash player" /></a>
</div>
1<div id="flashcontent">
2 <a href="http://get.adobe.com/flashplayer/" target="new_window" title="Follow this link to get Adobe Flash player"><img src="flash_no_content.jpg" alt="Follow this link to get Adobe Flash player" /></a>
3</div>
At thsi point the "No Flash" content will be displayed on screen.
4. Lastly include the script to switch out the "No Flash content" with the actual flash.
This Javascript will over right the div (by id) and insert the flash object into it. Supply the path, the div ID to replace the content for, followed by the height and width values. Next is the Flash player version (set it to a higher number than the Flash player version for Non flash content testing). Next you include the variables scopes you created in stage 2, passing in any other values your flash content is expecting.
ColdFISH is developed by Jason Delmore. Source code and license information available at coldfish.riaforge.org
<s cript>
swfobject.embedSWF("#path#/flashVideo.swf", "flashcontent", "150", "200", "9", "", flashvars, params, attributes);
</s cript>
1<s cript>
2 swfobject.embedSWF("#path#/flashVideo.swf", "flashcontent", "150", "200", "9", "", flashvars, params, attributes);
3</s cript>
If everything is running correctly you can now see your flash content. Simply change the flashplayer value, 9 above, to something higher, for example 20 to see the non flash content.
