FlashReplace - A light-weight JavaScript to insert Flash movies into your web page
Updated April 20th
I’m so used to having a $ method for accessing elements. Nevertheless, the idea is of course that FlashReplace should be stand-alone, so I replaced it with the standard document.getElementById.
Updated April 20th
Although I didn’t encounter any problems with not using an embed element (to have valid HTML code output), it has been strongly recommend that I use it to ensure maximum compatibility. Therefore, it has been added and the file size is now 2.1 KB.
Updated June 3rd
I’ve gotten a few e-mails asking how to add variables to the Flash movie, so here are some options:
The simplest way is to just do it through a querystring. I.e. “movieFileName.swf?testVar=hello”.
Another option is to reference the movie and do it something like this:
document.getElementById("movieName").SetVariable("testVar", "hello");
Ok, everyone and his mother are creating scripts to include Flash into a web page. I wanted to have my own version, but with less and more readable code, so here’s my JavaScript to include flash : FlashReplace.
Besides that I wanted to write the script myself, there were a few things about the two major scripts (that I’m sure you are all well aware of, SWFObject and UFO), that I didn’t like:
- I didn’t find the code that easy to read, and tweak, if wanted.
- The file size. SWFObject is about 6.7 KB and UFO is about 10.7 KB. I’m a sucker for small file sizes, so therefore
FlashReplaceis only 1.8 KB 2.1 KB.
- Neither of them created standards-compliant code;
FlashReplacedoes. Not anymore. Now it creates an additionalembedelement for maximum compatibility - Several lines are needed to insert a Flash Movie.
FlashReplaceonly needs one line.
I have the utmost respect for the people creating those libraries, and it is definitely likely that I’ve missed something when I wrote my script. Nevertheless, it seems to work fine in all major web browsers, so I share it with all of you in the hope that you will like it. And, of course, if you find any flaws, please let me know!
My version: FlashReplace
FlashReplace is a little object with a few parameters to include a Flash movie into a web page. It should also work fine with streamed movies and get us around the Eolas patent problem in IE. It basically just supports one parameter and one method:
defaultFlashVersion- A property to set the default Flash version to look for, if it isn’t set with the Flash movie creation.
replace- A method that replaces the content of a specified element within the web page with a Flash move. Basically, the element with the fallback content if Flash player isn’t available.
The parameters for the replace method
To be more specific, the replace method consists of a few parameters:
elmToReplace- The
idof the HTML element where you want to replace the content with the Flash movie. src- The path to the Flash movie (i.e. the
swffile). id- The id to give to the Flash movie element.
width- The width of the Flash movie.
height- The height of the Flash movie
version(optional)- The version of the Flash player needed to see the movie. Defaults to the
defaultFlashVersionproperty of theFlashReplaceobject if not specified. params(optional)- A way to add as many parameters as you want to the Flash movie.
Code examples
First, include the FlashReplace JavaScript file:
<script type="text/javascript" src="js/FlashReplace.js"></script>
Then, create a JavaScript block to insert the Flash movie/-s you want to:
<script type="text/javascript">
FlashReplace.replace("flash-content", "/flash/my-movie.swf", "flash-element-id", 800, 200);
</script>
Naturally, you can put a JavaScript block exactly where in the code where you want each Flash movie to be created, you can have all of them in the same code block at the bottom of the page, or you can have them in an external file:
<script type="text/javascript">
FlashReplace.replace("flash-content", "/flash/my-movie.swf", "flash-element-id", 800, 200);
FlashReplace.replace("da-cool-header", "/flash/cool-header.swf", "flash-element-id", 600, 350, 7, {wmode : "transparent"});
FlashReplace.replace("sidebar", "/flash/sidebar.swf", "flash-element-id", 200, 700, 7,
{
wmode : "transparent",
quality: "high",
bgcolor: "#ffffff"
}
);
</script>
What’s missing?
What it does miss, though, that the other JavaScript options contain, is a express install feature that I didn’t think was all that needed. I might add this in a future version if it’s really asked for, but at the time, simplicity and a very small file size were my main goals.
Feedback!
Please, give it a whirl, kick the tires. Tell me if it works fine for you, and your general take on it. Enjoy!
Free Movies Free Movies
Andy
but it’s ok now because i found out 
