PDA

View Full Version : Flexi Slideshow -- Need more than one slideshow per page (with different images)



CookieMonster
02-05-2014, 12:57 AM
1) Script Title: Flexi Slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/flexislide.htm

3) Describe problem: I'm sure this is really simple....How do I put more then one of these slideshows on a page? I need a few of them on the same webpage, but each one needs to flip different photos. Thanks.

vwphillips
02-05-2014, 02:51 AM
<!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" xml:lang="en" lang="en">

<head>
<title></title>
<script type="text/javascript">
/*<![CDATA[*/

var zxcSS={

init:function(o){
var id=o.ID,ary=o.ImageArray,ms=o.Delay,p=document.getElementById(id),i,z0=0;
if (p&&ary instanceof Array){
o.ary=[]
for (;z0<ary.length;z0++){
if (ary[z0]&&ary[z0][0]&&typeof(ary[z0][0])=='string'){
i=new Image();
i.src=ary[z0][0]
o.ary.push([i,ary[z0][1],ary[z0][2]]);
}
}
o.a=document.createElement('A');
o.i=document.createElement('IMG');
o.i.style.borderWidth='0px';
o.c=document.createElement('DIV');
o.a.appendChild(o.i);
p.appendChild(o.a);
p.appendChild(o.c);
o.n=0;
o.ms=typeof(ms)=='number'&&ms>100?ms:4000;
this.swap(o);
}
},

swap:function(o){
var oop=this;
o.n=o.ary[o.n]?o.n:0;
o.i.src=o.ary[o.n][0].src;
o.a.removeAttribute('href');
o.ary[o.n][1]?o.a.href=o.ary[o.n][1]:null;
o.c.innerHTML=o.ary[o.n][2]||'';
o.to=setTimeout(function(){ o.n=(o.n+1)%o.ary.length; oop.swap(o); },o.ms);
}

}

/*]]>*/
</script></head>

<body>

<div id="tst" style="width:200px;height:220px;text-Align:center;border:solid red 1px;" ></div>

<script type="text/javascript">
/*<![CDATA[*/


zxcSS.init({
ID:'tst',
ImageArray:[
['http://www.vicsjavascripts.org/StdImages/1.gif','myURL.htm','Image 1'],
['http://www.vicsjavascripts.org/StdImages/2.gif'],
['http://www.vicsjavascripts.org/StdImages/3.gif']
],
Delay:2000
});
/*]]>*/
</script>
<br />

<div id="tst2" style="width:200px;height:220px;text-Align:center;border:solid red 1px;" ></div>

<script type="text/javascript">
/*<![CDATA[*/


zxcSS.init({
ID:'tst2',
ImageArray:[
['http://www.vicsjavascripts.org/StdImages/4.gif','myURL.htm','Image 4'],
['http://www.vicsjavascripts.org/StdImages/5.gif'],
['http://www.vicsjavascripts.org/StdImages/6.gif'],
['http://www.vicsjavascripts.org/StdImages/7.gif']
],
Delay:3000
});
/*]]>*/
</script>
</body>

</html>

CookieMonster
02-05-2014, 07:43 AM
Thanks! I will try this tomorrow. I appreciate it! :-)