Problem in changing flash (swf) file location in embed or param tag using JavaScript

Problem in changing flash (swf) file location in embed or param tag using JavaScript

Manipulating the DOM (Document Object Model) using JavaScirpt is known to all. Changing the src attribute of the img (Image tag) tag using JavaScript is very common. But I had a problem in changing the flash (swf) file location in embed or param tag using JavaScript. I had following html code for my flash creative:
<div id="bannerCode"> <object width="422" height="62" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"> <param name="movie" value="//www.viralpatel.net/bannerImages/f9039149_3.swf" /> <param name="quality" value="high" /> <embed width="422" height="62" src="//www.viralpatel.net/bannerImages/f9039149_3.swf" quality="high" type="application/x-shockwave-flash" pluginspace="http://www.macromedia.com/go/getflashplayer" /> </object> </div>
Code language: HTML, XML (xml)
First I tried to change the src attribute of the embed tag and value attribute of the param tag (with name=”movie”). type using following JavaScript.
objDiv = document.getElementById("bannerCode"); //this will return the "object" of the div tag containing the flash code objDiv = arrTagObject = objDiv.getElementsByTagName("object"); //gives array of all the object tag inside the "bannerCode" div which containing the flash code for(i=0 ; i<arrTagObject.length;i++) { arrTabObject[i].width = new_width; arrTabObject[i].height = new_height; arrTagParam = arrTagObject[i].getElementsByTagName("param"); //this will return the "param" of the div tag containing the flash code for(j=0;j<arrTagParam.length;j++) { if("movie" == arrTagParam[j].name) { arrTagParam[j].value = new_flash_location; // set the new location for the flash (swf) movie } } } arrTagEmbed = objDiv.getElementsByTagName("embed"); arrTagEmbed[0].width = new_width; arrTagEmbed[0].height = new_height; arrTagEmbed[0].src = new_flash_location; [/code] But the above code didn't work, neither in <strong>Firefox</strong> nor in <strong>IE6</strong> (<strong>Internet Explorer 6</strong>). Even I checked in <strong>FireBug</strong> (the <strong>FireFox plugin</strong> to see the <strong>DOM-Document Object Model</strong>). In firebug all the attributes like height width and src of embed, all were set to new value but still the old <strong>Flash</strong> (<strong>swf</strong>) movie was displayed. Changing the <strong>src (source) attribute</strong> of the embed tag won’t render the new <strong>flash (swf)</strong> movie. You need to put the <strong>div tag</strong> around your flash object or embed code and do replace the <strong>innerHTML of the div tag</strong> using the document.getElementById("divTagId").innerHTML = new_flash_code. Following code works for me. <!-- wp:code {"language": "javascript"} --><pre class="wp-block-code"><code></code></pre><!-- /wp:code --> str1 =str1 += "\" height=\"" + new_height; str1 += "\"codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\"><param value=\""; str1 += new_flash_location + "\" name=\"movie\"/><param value=\"high\" name=\"quality\"/><embed width=\""; str1 += new_width + "\" height=\""; str1 += new_height + "\"pluginspace=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" quality=\"high\" src=\""; str1 += new_flash_location + "\"/></object>"; document.getElementById("bannerCode").innerHTML = str1;
Code language: JavaScript (javascript)

View Comments

  • This is a way to to it in non-IE browsers without replacing anything:
    *note that I'm using jQuery functions here but any js would work :)

    
    var flashObjectChildArray = [getObjectTag].children();
    $(flashObjectChildArray ).each(function(i) {
     // if node contains the attribute name:movie
     if ($(flashObjectChildArray [i]).attr('name') == 'movie') {
      $(flashObjectChildArray [i]).attr('value', [urlToYourNewFlashFile]);
     }
     // if node is an embed tag
     if (flashObjectChildArray [i].tagName.toLowerCase() == 'embed') {
      $(flashObjectChildArray [i]).attr('src', [urlToYourNewFlashFile]);
     }
    });
    
Share
Published by
Gaurav Patel
Tags: embed html JavaScript

Recent Posts

  • Java

Java URL Encoder/Decoder Example

Java URL Encoder/Decoder Example - In this tutorial we will see how to URL encode/decode…

4 years ago
  • General

How to Show Multiple Examples in OpenAPI Spec

Show Multiple Examples in OpenAPI - OpenAPI (aka Swagger) Specifications has become a defecto standard…

4 years ago
  • General

How to Run Local WordPress using Docker

Local WordPress using Docker - Running a local WordPress development environment is crucial for testing…

4 years ago
  • Java

Create and Validate JWT Token in Java using JJWT

1. JWT Token Overview JSON Web Token (JWT) is an open standard defines a compact…

4 years ago
  • Spring Boot

Spring Boot GraphQL Subscription Realtime API

GraphQL Subscription provides a great way of building real-time API. In this tutorial we will…

4 years ago
  • Spring Boot

Spring Boot DynamoDB Integration Test using Testcontainers

1. Overview Spring Boot Webflux DynamoDB Integration tests - In this tutorial we will see…

4 years ago