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

Using JavaScript to change <object> tag attributes

P: 2
I'm trying to build a simple gallery using some thumbnail images to load larger images and SWF files by swapping out the source hrefs. It works okay with images, but I'm having trouble doing the same thing with SWFs (Note: Both galleries exist on separate pages so there is no confusion.) Here is the function that works on the image gallery page:

Expand|Select|Wrap|Line Numbers
  1.  
  2. function showPic (whichpic) 
  3. {
  4.  if (document.getElementById) 
  5.     {
  6.           document.getElementById('placeholder').src = whichpic.href;
  7.         }
  8. return false;
  9. }
  10.  
I tried adapting it for the Flash gallery page like this (Note: In preview post, I'm seeing a big space on line 6 between the 'mo' and 'vie' in after setAttribute. This is a weird formatting error that caused by the forum, and doesn't exist inside my code.):

Expand|Select|Wrap|Line Numbers
  1. function showFlash (whichFlash)
  2. {
  3.     if(getElementByID)
  4.     {
  5.         document.getElementByID('placeholder').data = whichFlash.href;
  6.         document.getElementById('swfsrc').setAttribute('movie', whichFlash.href);
  7.     }
  8. return false;
  9. }
  10.  
I'm implementing my SWFs using the Flash Satay method which strips out the embed tag because it's not W3C compliant.

Expand|Select|Wrap|Line Numbers
  1. <object
  2.         id="placeholder"
  3.     type="application/x-shockwave-flash" 
  4.         data="../media/dresscat.swf"
  5.     width="700" height="300">
  6.         <param name="movie" value="../media/dresscat.swf" id="swfsrc" />
  7. </object>
  8.  
Thumbnail link that calls the function:
Expand|Select|Wrap|Line Numbers
  1. <a onclick="return showFlash(this)" href="../media/mia_flash_gallery.swf">image</a>
  2.  
What I want to happen:

When the thumbnail is clicked, the SWF with the ID 'placeholder' should be replaced with the SWF referenced in the thumbnail link, so the old SWF file is "swapped" for the new one.

What actually happens:

When the thumbnail is clicked, a page containing only the SWF is loaded in full frame.

Here's an example of the working image gallery on my site.
Thanks in advance.
Aug 14 '08 #1
Share this Question
Share on Google+
3 Replies


acoder
Expert Mod 15k+
P: 16,027
Add a return false in the showFlash function otherwise the link href URL will be followed.
Aug 14 '08 #2

P: 2
Add a return false in the showFlash function otherwise the link href URL will be followed.
Thanks, I actually already had that in there, but for some reason I omitted it when I posted.
Aug 14 '08 #3

acoder
Expert Mod 15k+
P: 16,027
Expand|Select|Wrap|Line Numbers
  1. if (getElementByID)
should be
Expand|Select|Wrap|Line Numbers
  1. if (document.getElementById)
and JavaScript is case-sensitive so it's a small 'd', not ID.
Aug 14 '08 #4

Post your reply

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