using an html link to dynamically change content in iFrame

S

synergy_711

I feel like this should be fairly easy but I have been struggling with
this for sometime. I have not been able to find someone who's had the
same problem as mine yet.

http://g.bach.home.insightbb.com/movies.html

I have a page set up on my website to view videos from various sites
by creating html pages and creating links to view them inside an
iframe. I'm getting tired of creating pages for every video that I
find and it seems to make more sense to create javascript coding that
will store the "video code" and generate a dynamic HTML page with that
code inside of the iframe.

I figured I could pass a variable (movieName) from the link to a
function and then use either an IF/THEN statement or an ARRAY to load
the code. Then open the iframe...write the HTML code + moviecode +
HTML code... and then close.

Any help would be greatly appreciated!
 
S

synergy_711

Your webpage has lots of other issues and problems:

- use a doctype declaration, preferably a strict DTD
- validate your markup code
- avoid using document.write() when there is no need to do this; your
wepbage should work (content accessible and webpage navigable) without
resorting to javascript support


The solution you look for is less accessible and more
technology-dependent. If you still want to pursue that choice, then
you'll have to use valid markup code to begin with.

FWIW, the loading of video inside the iframe worked for me; using
Firefox 2.0.0.2 here.

Gérard

-----------------------------------------------------------------------------------------------------


Ok..yes..I agree I need to clean things up. :)
FWIW, the loading of video inside the iframe worked for me; using
Firefox 2.0.0.2 here.

The current method works..but it is cumbersome. That's why I'm looking
for a new method.

I created another lil page (http://g.bach.home.insightbb.com/
betamovie.html) that may help you out a little bit more of where I'm
trying to go with this.
 
S

synergy_711

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://
www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<title>Beta Movie Page</title>


<!-- Start Array for movie info (to be moved to js file later) -->
<script language="javascript">
function loadMovies() {
var movieInventory = new Array();

movieInventory[0] = "<param name='movie' value='http://www.youtube.com/
v/tZZv5Z2Iz_s'></param><param name='wmode' value='transparent'></
param><embed src='
'
type='application/x-shockwave-flash' wmode='transparent' width='425'
height='350'></embed>";

movieInventory[1] = "<param name='movie' value='http://www.youtube.com/
v/tZZv5Z2Iz_s'></param><param name='wmode' value='transparent'></
param><embed src='
'
type='application/x-shockwave-flash' wmode='transparent' width='425'
height='350'></embed>";

}
</script>

<!-- End Array for movie info (to be moved to js file later) -->


<!-- Start code to generate page within iframe -->
<script language="javascript">
function changeMovie(movieName) {
var temp = movieName;
window.frames[0].innerHTML = "<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML
4.01 Transitional//EN''http://www.w3.org/TR/html4/
loose.dtd'><html><head><meta http-equiv='Content-Type' content='text/
html; charset=ISO-8859-1'><title>Now Showing</title><style type='text/
css'> body {background-color: #000000; margin-left: 0px; margin-top:
0px; margin-right: 0px; margin-bottom: 0px;}</style></
head><body><table width='720' border='0' cellspacing='0'
cellpadding='0'><tr><td align='center' valign='middle'
height='480'><object width='425' height='350'>}" +
movieInventory[temp] + "</object></td></tr></table></body></html>"

}

</script>

<!-- End code to generate page within iframe -->


<body onLoad="loadMovies()">
<!-- Start Movie Screen -->
<table align="center">
<td>
<iframe src="moviesplash.html" id="screen" name="screen" width="720"
height="480" scrolling="no" frameborder="0"></iframe>
</td>
</table>

<!-- End Movie Screen -->
<br>
<!-- Start Links -->
<table align="center">
<td>
<img src="images/games/accent.gif" alt="accent graphic"> <a href=""
onClick="changeMovie(0)">Voltron: Formation</a><br>
<img src="images/games/accent.gif" alt="accent graphic"> <a href=""
onClick="changeMovie(1)">Voltron: Intro</a> <br>
</td>

</table>
<!-- End Links -->
</body>
</html>


or i could just post the code...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,073
Latest member
DarinCeden

Latest Threads

Top