Hello,
I'm trying to write some javascript that will always allow me to float content over a flah player. To do this, the <object> tag needs to have a <param> tag added to set the wmode to transparent, and the <embed> tag needs to have the wmode attribute set to transparent also.
So the source will first look like:
<object width="560" height="340">
<param name="movie" value="http://www.youtube.com/v/V6dScKlrDwU&hl=en_GB&fs=1&"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/V6dScKlrDwU&hl=en_GB&fs=1&"
type="application/x-shockwave-flash"
allowscriptaccess="always"
allowfullscreen="true"
width="560"
height="340">
</embed>
</object>And I want the javascript to change it to:
<object width="560" height="340">
<param name="movie" value="http://www.youtube.com/v/V6dScKlrDwU&hl=en_GB&fs=1&"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/V6dScKlrDwU&hl=en_GB&fs=1&"
type="application/x-shockwave-flash"
allowscriptaccess="always"
allowfullscreen="true"
width="560"
height="340"
wmode="transparent">
</embed>
</object>The thing is, I currently have code that adds the parameters to the object and the embed tags, but I am unable to float content over the player. The javascript I currently have is:
function init(){
var embedCollection = document.getElementsByTagName("embed");
var objectCollection = document.getElementsByTagName("object");
for(i=0;i<objectCollection.length;i++){
var myParam = document.createElement("param");
myParam.setAttribute("name","wmode");
myParam.setAttribute("value","transparent");
objectCollection[i].appendChild(myParam);
}
for(i=0;i<embedCollection.length;i++){
embedCollection[i].setAttribute("wmode","transparent");
}
}
window.onload=init;If I use Firebug to inspect the page after it has loaded, I can see that all the elements have been updated with the appropriate tags and attributes, but the floating content does not appear above the flash player. I'm sure the floating content is coded correctly, because if I hard code the tags and attributes into the HTML instead of using javascript, the floating content appears.
I've been told on an IRC chatroom that I need to find away to reload the flash player after I've added my new tags and attributes, so that its aware of the new tags and attributes.
Does anyone know how can I use javascript to force the flash player to reload itself?
Thanks for any help you can provide! :)