markb
08-17-2006, 06:45 PM
I am trying to create a page which will display 2 seperate slideshows side by side. I have created a table and am able to get one show going, but not the other. Can you give me an idea..here is my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<!--Links page to a&p Styles Sheet-->
<link rel="stylesheet"
href="focusedstyles.css"
type="text/css" />
<script language="JavaScript">
<!--JavaScript slide show code
// Define slide show variable and set show speed in milliseconds
var speed = 5000;
// Define photo hold duration variable and set photo hold time
var holdtime = 3;
// Define variable for photo array
var photo = new Array();
photo[0] = 'images/alicia.gif'
photo[1] = 'images/sen6.gif'
photo[2] = 'images/senboy.gif'
photo[3] = 'images/senior6.gif'
photo[4] = 'images/senior1.gif'
photo[5] = 'images/sen5.gif'
photo[6] = 'images/kaela.gif'
photo[7] = 'images/blonde3.gif'
photo[8] = 'images/senboy2.gif'
photo[9] = 'images/riann2.gif'
var h;
var j = 0;
var k = photo.length;
var tempArray = new Array();
for(i = 0; i < k; i++)
{
tempArray[i] = new Image();
tempArray[i].src = photo[i];
}
function runSlideShow()
{if (document.all)
{
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=holdtime)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = tempArray[j].src;
if (document.all)
{
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (k-1)) j = 0;
h = setTimeout('runSlideShow()', speed);
}
var word = new Array();
word[0] = 'images/class07.gif'
word[1] = 'images/freedom.gif'
word[2] = 'images/friends.gif'
word[3] = 'images/individuality.gif'
word[4] = 'images/personality.gif'
word[5] = 'images/poise.gif'
word[6] = 'images/potential.gif'
word[7] = 'images/style.gif'
var w;
var x = 0;
var y = photo.length;
var tempArray = new Array();
for(z = 0; z < y; z++)
{
tempArray[z] = new Image();
tempArray[z].src = photo[z];
}
function runSlideShow()
{if (document.all)
{
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=holdtime)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = tempArray[x].src;
if (document.all)
{
document.images.SlideShow.filters.blendTrans.Play();
}
x = x + 1;
if (x > (y-1)) x = 0;
h = setTimeout('runSlideShow()', speed);
}
//end of slide show code-->
</script>
</head>
<!--body of page-->
<!--Create a table which will contain slide show in row one, cell one-->
<body onLoad="runSlideShow()">
<table class="general">
<tr class="size26" class="general">
<td width="1%" > </td><td>Focused-up Photography
</tr>
<tr class="name">
<td colspan="2"> <p style="font-size: 20pt;">Phone: 541-261-2410</p></td>
</tr>
</table>
<table class="noborder" cellpadding="10%">
<tr><td> </td></tr>
<tr>
<td class="cellheight" cellpadding="5px"><img src="1.jpg" alt = "slideshow" name="SlideShow" />
</td>
<td class="cellheight" cellpadding="5px"><img src="class07.jpg" alt = "slideshow" name="SlideShow" />
</td>
</tr>
</table>
<p class="footer">
<a href="index.html">Home Page |</a>
<a href="family.html">Family Portraits |</a>
<a href="seniors.html">Seniors |</a>
<a href="moment.html">Heart of the Moment |</a>
<a href="headshot.html">Headshots |</a>
<a href="wedding.html">Weddings |</a>
<a class="center" href="shawna's email">Contact Us</a></p>
</body>
</html>
thanks
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<!--Links page to a&p Styles Sheet-->
<link rel="stylesheet"
href="focusedstyles.css"
type="text/css" />
<script language="JavaScript">
<!--JavaScript slide show code
// Define slide show variable and set show speed in milliseconds
var speed = 5000;
// Define photo hold duration variable and set photo hold time
var holdtime = 3;
// Define variable for photo array
var photo = new Array();
photo[0] = 'images/alicia.gif'
photo[1] = 'images/sen6.gif'
photo[2] = 'images/senboy.gif'
photo[3] = 'images/senior6.gif'
photo[4] = 'images/senior1.gif'
photo[5] = 'images/sen5.gif'
photo[6] = 'images/kaela.gif'
photo[7] = 'images/blonde3.gif'
photo[8] = 'images/senboy2.gif'
photo[9] = 'images/riann2.gif'
var h;
var j = 0;
var k = photo.length;
var tempArray = new Array();
for(i = 0; i < k; i++)
{
tempArray[i] = new Image();
tempArray[i].src = photo[i];
}
function runSlideShow()
{if (document.all)
{
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=holdtime)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = tempArray[j].src;
if (document.all)
{
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (k-1)) j = 0;
h = setTimeout('runSlideShow()', speed);
}
var word = new Array();
word[0] = 'images/class07.gif'
word[1] = 'images/freedom.gif'
word[2] = 'images/friends.gif'
word[3] = 'images/individuality.gif'
word[4] = 'images/personality.gif'
word[5] = 'images/poise.gif'
word[6] = 'images/potential.gif'
word[7] = 'images/style.gif'
var w;
var x = 0;
var y = photo.length;
var tempArray = new Array();
for(z = 0; z < y; z++)
{
tempArray[z] = new Image();
tempArray[z].src = photo[z];
}
function runSlideShow()
{if (document.all)
{
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=holdtime)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = tempArray[x].src;
if (document.all)
{
document.images.SlideShow.filters.blendTrans.Play();
}
x = x + 1;
if (x > (y-1)) x = 0;
h = setTimeout('runSlideShow()', speed);
}
//end of slide show code-->
</script>
</head>
<!--body of page-->
<!--Create a table which will contain slide show in row one, cell one-->
<body onLoad="runSlideShow()">
<table class="general">
<tr class="size26" class="general">
<td width="1%" > </td><td>Focused-up Photography
</tr>
<tr class="name">
<td colspan="2"> <p style="font-size: 20pt;">Phone: 541-261-2410</p></td>
</tr>
</table>
<table class="noborder" cellpadding="10%">
<tr><td> </td></tr>
<tr>
<td class="cellheight" cellpadding="5px"><img src="1.jpg" alt = "slideshow" name="SlideShow" />
</td>
<td class="cellheight" cellpadding="5px"><img src="class07.jpg" alt = "slideshow" name="SlideShow" />
</td>
</tr>
</table>
<p class="footer">
<a href="index.html">Home Page |</a>
<a href="family.html">Family Portraits |</a>
<a href="seniors.html">Seniors |</a>
<a href="moment.html">Heart of the Moment |</a>
<a href="headshot.html">Headshots |</a>
<a href="wedding.html">Weddings |</a>
<a class="center" href="shawna's email">Contact Us</a></p>
</body>
</html>
thanks