By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,576 Members | 1,462 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,576 IT Pros & Developers. It's quick & easy.

FireFox Hates My Simple Code

P: 6
Expand|Select|Wrap|Line Numbers
  1. function flash_insert()
  2. {
  3.   var flash_to_insert = '<object type="application/x-shockwave-flash" data="myflash.swf" width="980" height="130">';
  4.   flash_to_insert = flash_to_insert + '<param name="movie" value="myflash.swf" />';
  5.   flash_to_insert = flash_to_insert + '</object>';
  6.  
  7.   document.getElementById('flash_2').innerHTML = flash_to_insert;
  8. }
  9.  
  10. .
  11. .
  12. .
  13.  
  14. <span id="flash_2"></span>
Hey y'all,

The code above works fine in IE7, Opera9, but NOT in Firefox. Why??

Thanks in advance.
Sep 11 '08 #1
Share this Question
Share on Google+
8 Replies


acoder
Expert Mod 15k+
P: 16,027
Any errors?

If you include the HTML directly without JavaScript, does it work?
Sep 11 '08 #2

P: 6
Any errors?

If you include the HTML directly without JavaScript, does it work?
No errors in the (FF) console. The HTML content in the variable works when directly included in the HTML document.

The code works as expected in IE7 and Opera9, and what is interesting is that I suspect that the javascript is also working in FF, as there are no errors.

For example;

Expand|Select|Wrap|Line Numbers
  1. function flash_insert()
  2. {
  3.   var flash_to_insert = '<br /><a href="javascript:flash_insert();">hello</a>';
  4.  
  5.   document.getElementById('flash').innerHTML = flash_to_insert;
  6. }
or;

Expand|Select|Wrap|Line Numbers
  1. function flash_insert()
  2. {
  3.   var flash_to_insert = '<p>hello</p>';
  4.  
  5.   document.getElementById('flash').innerHTML = flash_to_insert;
  6. }
will work in all browsers, but this;

Expand|Select|Wrap|Line Numbers
  1. function flash_insert()
  2. {
  3.   var flash_to_insert = '<object type="image/gif" data="../images/frvcc.gif" style="width:98px; height:98px;">';
  4.   flash_to_insert = flash_to_insert + '</object>';
  5.  
  6.   document.getElementById('flash').innerHTML = flash_to_insert;
  7. }
won't work in FF. It seems as though FF won't show content associated with the <object> tag when inserted by JS.

This may not be a javascript problem after all, but more likely a FF issue.

Sorry if I'm in the wrong forum.
Sep 11 '08 #3

acoder
Expert Mod 15k+
P: 16,027
Instead of using innerHTML, have you tried document.createElement("object") and setting attributes/children and appendChild()?
Sep 11 '08 #4

P: 6
Instead of using innerHTML, have you tried document.createElement("object") and setting attributes/children and appendChild()?
AHA!! Yes, that works. I forgot that my web docs are being served by PHP, which by the way, as you know, can serve different header info to different browsers. I'm serving XHTML1.1 to FF, Opera and any other browser that can handle 'Content-Type: application/xhtml+xml'. IE cannot handle this type of doc, as I understand, so it is being served 'Content-Type: text/html.'

Now the javascript is not working for IE. Is it because IE cannot treat the doc as XML?

What can I do?

Thanks for your help, acoder.
Sep 11 '08 #5

P: 6
Maybe the code is the problem.

Expand|Select|Wrap|Line Numbers
  1. function flash_insert()
  2. {
  3.   var flash_to_insert = document.createElement('object');
  4.  
  5.   flash_to_insert.setAttribute('type','image/gif');
  6.  
  7.   flash_to_insert.setAttribute('data','../images/frvcc.gif');
  8.  
  9.   flash_to_insert.setAttribute('style','width:98px;height:98px;');
  10.  
  11.   document.getElementById('flash').appendChild(flash_to_insert);
  12. }
Sep 11 '08 #6

acoder
Expert Mod 15k+
P: 16,027
IE unfortunately uses its non-standard createElement - see link. If you specify the whole HTML string, it'll work. Ugly!
Sep 11 '08 #7

P: 6
A sincere thanks to you, acoder, for pointing me in the right direction.

I've read the article from the link and it does seem a little ugly.

Since I usually serve up web pages with PHP, I decided to look for a solution using PHP.

What I did was to create code in PHP that selects a set of javascript code to be used when serving HTML, and a different set of javascript code when serving XHTML. Very little extra PHP was needed to link to the proper javascript file, but it did involve writing twice the amount of javascript to accomodate both scenarios.

UGLIER??

It works though, and it seperates the crossbrowser issues I've been having nicely, without much extra machine-cycle or (JS) file download time.

I can now;

1. Serve a web doc (HTML or XHTML, depending on the client) with flash content, without the 'Click to activate and use this control' pop-up, seen in Opera9.

2. Replace flash content dynamically on a web doc whether served-up as HTML or XHTML.

Being a rookie, I feel that I may have reinvented the wheel for no-good reason and there may be an easier solution out there.

Please comment on my rant.

Thanks again, acoder.
Sep 11 '08 #8

acoder
Expert Mod 15k+
P: 16,027
In my haste, I forgot about SWFObject (formerly FlashObject). That should handle all the cross-browser issues for you.

PS. just noticed what your user handle spells. Nice! :D
Sep 11 '08 #9

Post your reply

Sign in to post your reply or Sign up for a free account.