Click to See Complete Forum and Search --> : HELP! 2 slide shows don't work


Jarin
08-28-2003, 01:53 PM
Hallo, I’m desparate.
I have placed slideshow on my page (pictures 1-5), which works perfectly. But when adding 2nd slide show (pictures 6-10) on the same page, than it does not work. Slide show #1 shows pics 1-5, slide show #2 show only pic 6.
Pls who can help me to solve this problem, that both slide shows will work on same page showing different block of pictures, so the one shows pics 1-5 and the other 6-10. Many thanks.
Used the followng:

<html>

<head>
<script language="JavaScript1.2" src="slide2.js"></script>
<script language="JavaScript1.2" src="diasl2.js"></script>
</head>
<body onload="runSlideShow()" onload="runSLShow()">
<div style="position:absolute;left:282;top:322;visibility:visible">
<table border="0" bgcolor="#8080FF" cellspacing="0" cellpadding="7">
<tr>
<td id="VU" height=82 width=142>
<img src="1.jpg" name='SlideShow' alt="" width=140 height=80></td>
</tr>
</table></div>

<div style="position:absolute;left:382;top:432;visibility:visible">
<table border="0" bgcolor="#8080FF" cellspacing="0" cellpadding="7">
<tr>
<td id="VU" height=82 width=142>
<img src="6.jpg" name='SLShow' alt="" width=140 height=80></td>
</tr>
</table></div>

</body>
</html>

SCRIPT “slide2.js”

var slideShowSpeed = 3000;

var crossFadeDuration = 3;

var Pic = new Array();

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}


SCRIPT for "diasl2.js" is in fact the same as “slide2.js” except that following variables are everywhere replaced: : t (=w), j (=k), p (=q), preLoad (=preSLoad) en SlideShow (=SLShow), so the script looks now:


var slideShowSpeed = 3000

var crossFadeDuration = 3

var Pic = new Array()

Pic[0] = '6.jpg'
Pic[1] = '7.jpg'
Pic[2] = '8.jpg'
Pic[3] = '9.jpg'
Pic[4] = '10.jpg'

isIE=document.all;
isNN=!document.all&&document.getElementById;
isN4=document.layers;
isHot=false;

function ddInit(e){
topDog=isIE ? "BODY" : "HTML";
whichDog=isIE ? document.all.theLayer : document.getElementById("theLayer");
hotDog=isIE ? event.srcElement : e.target;
while (hotDog.id!="titleBar"&&hotDog.tagName!=topDog){
hotDog=isIE ? hotDog.parentElement : hotDog.parentNode;
}
if (hotDog.id=="titleBar"){
offsetx=isIE ? event.clientX : e.clientX;
offsety=isIE ? event.clientY : e.clientY;
nowX=parseInt(whichDog.style.left);
nowY=parseInt(whichDog.style.top);
ddEnabled=true;
document.onmousemove=dd;
}
}

function dd(e){
if (!ddEnabled) return;
whichDog.style.left=isIE ? nowX+event.clientX-offsetx : nowX+e.clientX-offsetx;
whichDog.style.top=isIE ? nowY+event.clientY-offsety : nowY+e.clientY-offsety;
return false;
}

function ddN4(whatDog){
if (!isN4) return;
N4=eval(whatDog);
N4.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
N4.onmousedown=function(e){
N4.captureEvents(Event.MOUSEMOVE);
N4x=e.x;
N4y=e.y;
}
N4.onmousemove=function(e){
if (isHot){
N4.moveBy(e.x-N4x,e.y-N4y);
return false;
}
}
N4.onmouseup=function(){
N4.releaseEvents(Event.MOUSEMOVE);
}
}

function hideMe(){
if (isIE||isNN) whichDog.style.visibility="hidden";
else if (isN4) document.theLayer.visibility="hide";
}

function showMe(){
if (isIE||isNN) whichDog.style.visibility="visible";
else if (isN4) document.theLayer.visibility="show";
}

document.onmousedown=ddInit;
document.onmouseup=Function("ddEnabled=false");

var w;
var k = 0;
var q = Pic.length;

var preSLoad = new Array()
for (i = 0; i < q; i++){
preSLoad[i] = new Image();
preSLoad[i].src = Pic[i];
}

function runSLShow(){
if (document.all){
document.images.SLShow.style.filter="blendTrans(duration=2)";
document.images.SLShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SLShow.filters.blendTrans.Apply();
}
if (!isN4) document.images.SLShow.src = preSLoad[k].src;
if (isN4) document.layers['theLayer'].document.images['SLShow'].src = preSLoad[k].src;
if (document.all){
document.images.SLShow.filters.blendTrans.Play();
}
k = k + 1;
if (k > (q-1)) k=0;
w = setTimeout('runSLShow()', slideShowSpeed);
}

Exuro
08-28-2003, 02:42 PM
*Laughs*, all that work and it was just this one little thing. Okay, you have 2 onload="" attributes in your body tag. It should actually be like this:
<body onload="runSlideShow();runSLShow()">
See how you just separate the function calls with a semi-colon? Now it'll call both functions instead of just the first one. Well, that should do it!

Jarin
08-28-2003, 03:09 PM
:D :D :D :D :D :D :D :D :D :D

GREAT !!!!

Many thanks Exuro, I am really greatfull you have solve this (for you small) problem. Have already tried on other forums but without any success.
THANKS !!!