Web Development Tips and Tricks

Last Updated - 6/16/06

How to use this site:

This site features various tips and tricks as well as solutions I've found while doing web and Flash development. Most of the information that I've found on these subjects has been through tutorials. Two sites I've found to be particularly useful are Actionscript.org and World Wide Web Consortium (W3C) www.w3c.org. Both offer a wide varied of tutorials on various subjects all completely free. They offer these tutorials to better the web though open source. That's why I'm here. I've used their knowledge to make my work better, now I hope you can use my tips and tricks to make your work better and so on.

The Flash Object

As many of you know the latest release (April 2006) of Internet Explorer has some added "security features" that alert users to ActiveX controls in their web browser. An ActiveX controller could be a quicktime movie, a Java Applet, and for the purposes of this tip, A Flash swf file.

Your browser identifies these controllers by placing a white border around it. In order to give the controller input (use it in any way in the browser) you have to click on it with your mouse or press the space bar. So you can quickly see not only the asthetic problems but usability issues. Thankfully there is an easy workaround for this problem. It's called the Flash Object. Developed by Geoff Stearns, the Flash Object acts to replicate the version detection, object and embed tags that flash 8 creates for you when you publish your swf. The cool part is that it stores this information in a separate javascript file and calls to it from inside your html. Because javascript is loading the object and embed tags into your document it skips through the "security feature" in IE and your ActiveX control is off and running without the eye sore or the usability issue of that border.

How do I implement this on my own site you ask? Well it's actually quite simple. First you have to download the flashobject.js file. You won't have to modify that file at all, which is a good thing if you're not familiar with javascript. Feel free to open it up and look around maybe you'll learn something, I did.

Next we're going to go into our html page and add a few things:

First, were going to place a <div> in the html where we want our flash to appear and give it a unique id. If you're not familiar with html or div's go here for a quick rundown. The code should look like this.

You can place this script anywhere in your html, but I've found it's best to place it either directly after the div you are placing the flash into OR at the end of your html. This ensures that all of your html is loaded into the page before you have javascript fill in the flash.

You'll have to modify this code slightly to use your own swf, but don't worry I'll walk you through it. Lets explore each line of this code and see what variables you need to change and what each of them refer to.

var myVariable - refers to the variable that will hold your flash object. It's how you're going to write out all the "stuff" in the flashobject.js file
new FlashObject( "path to your swf file", "right click menu", "flashobject variable (don't modify this)", "width", "height", "quality (10 is highest)", "background color"); - this is the function that call to the flashobject.js file and fills in all the information about your swf. These are the things that you need to change. Change "myflashmovie.swf" to the path and name of your swf file. Choose whether or not you want to allow the user to have a right click menu options. Keep "mymovie" as is. It's a variable inside the flashobject.js file. Change the width and height to match the dimensions of your swf. You can choose the quality of the swf 1 being lowest and 10 being highest. Finally, choose the background color of the swf.
myVariable.write("myDiv"); - this is a javascript function that writes out the <embed> and <object> tags for you swf file. You have to change "myDiv" to refer to the <div> id you created earlier.

That's it. You're good to go. If you found this useful pass it on to friends, family, whomever. We're all trying to make the web a better place to play. If you have questions feel free to email me.