As part of my site
deign I was after a method in which I could have a reusable banner.
This banner was going to be a flash program and would be cached
for every page. I wanted to pass a variable to the flash program,
and that would be the title for that page.
There are several methods
of passing variables to a flash program. The first method that
I used, passed the variables via the HTML tag value.
Below is an extract of the code that I use for the navigation bar:
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
WIDTH=155 HEIGHT=450>
<PARAM NAME=movie VALUE="/nav_bar_mncom.swf?first_menu=Web Design">
<PARAM NAME=quality VALUE=best>
<PARAM NAME=salign VALUE=T>
<PARAM NAME=bgcolor VALUE=#000000>
<EMBED src="/nav_bar_mncom.swf" quality=best salign=T bgcolor=#000000 WIDTH=140 HEIGHT=450 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">
</EMBED>
</OBJECT>
The code in yellow
is what I added to get the variable passed to my flash program.
Inside my flash program I use the variable "first_menu"
to indicate which menu has to be displayed when the page is loaded.
This works well, but for one problem. Passing a variable in this
manner causes the browser to cache each variation of the variable.
In the above example, I would have a "nav_bar_mncom.swf?first_menu=Web%20Design"
variable in my cache. For the navigation bar there are only a
few variations so it was not a problem. But with the banner, every
page had a different banner, and therefore the browser ended caching
every variation. This partly defeated the purpose of having a
reusable banner.
So another method was needed which kept the same
swf in cache. The method used was the Javascript SetVariable method.
<script language = "JavaScript">
<!--
function PassFlash(){
window.document.mndbanner.SetVariable("banner", "Flash Tutorial");
}
//-->
</script>
<body onLoad="PassFlash()" >
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" id=mndbanner width=575 height=100
align="middle">
<param name=movie value="/mnd_banner.swf">
<param name=quality value=best>
<param name=salign value=T>
<param name=bgcolor value=#000000>
<embed src="/mnd_banner.swf" quality=best salign=T bgcolor=#000000 width=575 height=100
NAME=mndbanner swLiveConnect=true type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" align="middle">
</embed>
</object>
Extra bits have to
be added in the code that loads the swf plugin. They are the id=mndbanner in the codebase
tag, the NAME=mndbanner and swLiveConnect=true in
the embed tag. The movie name ( name of the swf file), in this
case mndbanner has to be the same as shown.
One final piece of
code that has to be included is the onLoad="PassFlash()" inside the body tag. This tells the browser to execute the javascript
function PassFlash() when the page
is loaded. Keep in mind that the variable will not be passed till
the page is fully loaded. Another option to load the banner variable
is to included a call of the PassFlash() function just after the object is defined.
<script language = "JavaScript">
<!--
function PassFlash(){
window.document.mndbanner.SetVariable("banner", "Flash Tutorial");
}
//-->
</script>
<body>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" id=mndbanner width=575 height=100
align="middle">
<param name=movie value="/mnd_banner.swf">
<param name=quality value=best>
<param name=salign value=T>
<param name=bgcolor value=#000000>
<embed src="/mnd_banner.swf" quality=best salign=T bgcolor=#000000 width=575 height=100
NAME=mndbanner swLiveConnect=true type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" align="middle">
</embed>
</object>
<script language = "JavaScript">
<!--
PassFlash();
//-->
</script>
To see an actual example click here
|