The new forums will be named Coin Return (based on the most recent vote)! You can check on the status and timeline of the transition to the new forums here.
The Guiding Principles and New Rules document is now in effect.
IE6, <embed> tags and Javascript updating
SeñorAmor
!!!Registered User regular
!!!Registered User regular
(Apologies for the cross-post. I haven't had much luck in H/A and thought I'd give you guys a try.)
I am making a new soccer-themed website for my boss. He's a coach and wants to have soccer-related YouTube videos embedded, for his kids to watch. Rather than have 10 clips embedded, I have a list of all the clips. Upon clicking each link, the appropriate video will load on the page.
I have accomplished this by using Javascript's .innerHTML function to rewrite only the div that contains the movie. This way the users don't have to reload the entire page. It functions fine on FF, Opera and IE7, but not in IE6, and I can't figure out why. I have done some testing and IE6 is rewriting the div contents fine, but as soon as I try to rewrite and include an <embed> tag, IE6 does nothing.
I'm not sure what's going wrong and any help would be much appreciated.
Relevant code:
[HTML File]
[video.js]
I am making a new soccer-themed website for my boss. He's a coach and wants to have soccer-related YouTube videos embedded, for his kids to watch. Rather than have 10 clips embedded, I have a list of all the clips. Upon clicking each link, the appropriate video will load on the page.
I have accomplished this by using Javascript's .innerHTML function to rewrite only the div that contains the movie. This way the users don't have to reload the entire page. It functions fine on FF, Opera and IE7, but not in IE6, and I can't figure out why. I have done some testing and IE6 is rewriting the div contents fine, but as soon as I try to rewrite and include an <embed> tag, IE6 does nothing.
I'm not sure what's going wrong and any help would be much appreciated.
Relevant code:
[HTML File]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/general.css" />
<script language="javascript" type="text/javascript" src="includes/video.js"></script>
</head>
<body>
<div id="main">
<div id="subheader">
<img src="images/header_videos.gif" width="110" height="45" alt="Videos" title="Videos" />
</div>
<div id="video_list">
<div id="video_list_header">
Click the links below<br /> to watch a video.
</div>
<div id="video_list_text">
<a href="#view" onclick="play_video('FU4Edue4n9A')">Brazilian Soccer Schools #1</a><br />
<a href="#view" onclick="play_video('mBOUZmtx6JM')">Great Goalkeeper Moments</a><br />
<a href="#view" onclick="play_video('M3S-mOvN2Xs')">Soccer Skills</a>
</div>
</div>
<a name="view" />
<div id="video">
<div style="text-align: center; padding-top: 75px; color: #FFFFFF;">Please select a video from the list on the left.</div>
</div>
</div>
</body>
</html>
[video.js]
function play_video(id)
{
document.getElementById('video').innerHTML = 'Loading video... One moment please.';
var embed_text = '<object width="425" height="350">' +
'<param name="movie" value="http://www.youtube.com/v/{MOVIE_ID}"></param>' +
'<param name="wmode" value="transparent"></param>' +
'<embed src="http://www.youtube.com/v/{MOVIE_ID}" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed>' +
'</object>';
embed_text = embed_text.replace(/{MOVIE_ID}/g, id);
document.getElementById('video').innerHTML = embed_text;
}
SeñorAmor on
0