...
PDA

How do use this image swapping code repeatedly in the same page?

Brady h
07-27-2006, 04:03 PM
I am new to web design and javascript even more so. I have a cut and paste script which rotates a series of images. It works just fine on its own.When i use it for multiple places on the same page, each to display it's own series of images, the best i can do is get all seven boxes displaying the same series of images and all working to only one timer.
I have mixed and matched, varied and altered this code to try and get it to work. I need to somehow seperate them.I also want to store the code between the <head></head> in a seperate .jss.
The fixes for similar problems experianced by other people i've seen are custom made, but i dont know enough to apply them here.
Should i use a different code all together?

Its time to bring out the big guns!!
Pls, someone help me.

Thank you.

<script type="text/JavaScript">
<head>
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

var imgs = new Array('sample1.jpg','sample2.jpg','sample3.jpg');
var delay = 4000;
var counter = 0;

function preloadImgs(){
for(var i=0;i<imgs.length;i++){
MM_preloadImages(imgs[i]);
}
}

function randomImages(){
if(counter == (imgs.length)){
counter = 0;
}
MM_swapImage('rotator', '', imgs[counter++]);
setTimeout('randomImages()', delay);
}

</script>

</head>

<body onload="preloadImgs();randomImages();">


<td><img src="sample1.jpg" name="rotator" id="rotator" /></td>



p.s my browser is i.e
vwphillips
07-27-2006, 06:29 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
// Simple Slide Show OOP (27-July-2006)
// by Vic Phillips http://www.vicsjavascripts.org.uk

// A Simple Slide Show utilising Object Orientated Technics
// allow as many applications as required to have independent functionality.
// Images are defied in the HTML Code and may be optionally randomised.
// Controls allow the display of a specific, next, previous image
// or images automatically sequenced.



// ***** The HTML Code
//
// Each Slide Show is defined in the HTML Code
// e.g.
// <div id="TstSS1" style="position:relative;width:100px;height:50px;" >
// <img src="One.gif" width="100" height="50" >
// <img src="Two.gif" width="100" height="50" >
// <img src="Three.gif" width="100" height="50" >
// </div>
// The parent <DIV> must be assigned a unique ID name
// and must have a positional style of 'position:relative;' or 'position:absolute;'
// The images may have a style of 'position:absolute;', this will be forced during initialisation.



// ***** Initialisation
// Each Slide Show must be initialised from a <BODY> or window onload event
// e.g.
// <body onload="zxcOOPSlideShow('fred','',2000,2);">
// where
// parameter 0 = the unique ID name of the Slide Show parent node. (string)
// parameter 1 = the mode, 'A' = auto rotate on loading, 'R' = randomise images. (string '', 'A', 'R' or 'RA')
// parameter 2 = the auto rotate delay between images in milliSeconds(default 1000). (digits)
// parameter 3 = the start image, starting from 1(default 1). (digits)



// ***** The Controls
//
// The Slide Shows may be controlled by an event call to function 'zxcSSImg'
// e.g.
// <input type="button" name="" value="Next" onclick="zxcSSImg('TstSS1',1)">
// <input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS1')">
// <input type="button" name="" value="Last" onclick="zxcSSImg('TstSS1',-1)"><br>
// <img src="One.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,1)" >
// where:
// parameter 0 = the unique ID name of the Slide Show parent node. (string)
// parameter 1 = the mode 1 = next image, -1 = previous image, 0 = auto sequence. (digits)
// parameter 2 = (optional) over rides parameter 2, the image number to display. (omit or digits)

// ***** General
//
// All variable, function etc. names are prefixed with 'zxc' to minimise conflicts with other JavaScripts
// These character are easily changed to characters of choice using global find and replace.
//
// The Functional Code(about 2K) is best as an External JavaScript.
//
// Tested with IE6 and Mozilla FireFox
//


// **** Functional Code - NO NEED to Change

function zxcSSImg(zxcid,zxcd,zxcnu){
var zxcoop=window['zxcSS'+zxcid];
if (!window['zxcSS'+zxcid]){ return; }
clearTimeout(zxcoop.to);
if (zxcnu){ if (zxcnu<1||zxcnu>=zxcoop.imgary.length){ return; }; zxcoop.cnt=zxcnu-1; zxcoop.d=0; zxcoop.next(); }
else if (zxcd==1||zxcd==-1){ zxcoop.d=zxcd; zxcoop.next(); }
else if (!zxcnu) { zxcoop.auto(); }
}

function zxcOOPSlideShow(zxcid,zxcmd,zxcdly,zxcfirst){
if (window['zxcSS'+zxcid]){ return; }
window['zxcSS'+zxcid]=new zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst);
}

function zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst){
var zxcp=document.getElementById(zxcid);
var zxcimgs=zxcp.getElementsByTagName('IMG');
if (!zxcimgs){ return; }
this.imgary=[];
for (var zxc0=0;zxc0<zxcimgs.length;zxc0++){ zxcSSStyle(zxcimgs[zxc0],{position:'absolute',zIndex:'0',left:'0px',top:'0px'}); this.imgary.push(zxcimgs[zxc0]); }
if (zxcmd.match('R')){ this.imgary=this.imgary.randomise(); }
this.ref='zxcSS'+zxcid;
window[this.ref]=this;
this.to=null
this.dly=zxcdly||1000;
this.d=1;
this.cnt=zxcfirst||1;
this.cnt--;
this.lst=zxcimgs[this.cnt];
this.lst.style.zIndex='1';
if (zxcmd.match('A')){ this.auto(); }
}

zxcSSOOP.prototype.next=function(){
this.cnt+=this.d;
if (this.cnt==this.imgary.length){ this.cnt=0; }
if (this.cnt<0){ this.cnt=this.imgary.length-1; }
this.lst.style.zIndex='0';
this.imgary[this.cnt].style.zIndex='1';
this.lst=this.imgary[this.cnt];
this.d=this.d||1;
}

zxcSSOOP.prototype.auto=function(){
this.next();
this.setTimeOut('auto()',this.dly);
}

zxcSSOOP.prototype.setTimeOut=function(zxcf,zxcd){
this.to=setTimeout('window.'+this.ref+'.'+zxcf,zxcd);
}

Array.prototype.randomise=function(){
this.cnt=0; this.ta=[];
while (this.cnt<this.length){ zxctmp=Math.floor(Math.random()*this.length-1)+1; if (!this.ta[zxctmp]){this.ta[zxctmp]=this[this.cnt]; this.cnt++; } }
return this.ta;
}

function zxcSSStyle(zxcele,zxcstyle){
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
}


//-->
</script></head>

<body onload="zxcOOPSlideShow('TstSS1','',2000,1);zxcOOPSlideShow('TstSS2','RA');">
<div id="TstSS1" style="position:relative;width:100px;height:50px;" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Three.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Four.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Five.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Six.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Seven.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Eight.gif" width="100" height="50" >
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS1',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS1')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS1',-1)"><br>
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,1)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,2)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Three.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,3)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Four.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,4)" >
<br>
<img src="http://www.vicsjavascripts.org.uk/StdImages/Five.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,5)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Six.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,6)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Seven.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,7)" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Eight.gif" width="25" height="13" onclick="zxcSSImg('TstSS1',0,8)" >
<br>
<br>
<div id="TstSS2" style="position:relative;width:100px;height:50px;" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Three.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Four.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Five.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Six.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Seven.gif" width="100" height="50" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Eight.gif" width="100" height="50" >
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS2',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS2')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS2',-1)">
</body>

</html>
Brady h
07-28-2006, 10:57 AM
Thanks 4 taking the time to answer my post and so speedily too.
Very much appreciated.
Unfortunately i need to ask you some more.

I have used your example code exactly the same without changing anything except for the images.( short address)
I dont get a slide show but i get all the images in column (except for one which disappears after the page has loaded).

I then copied the code in a new page with nothing else and i still get the same effect.

What could i be overlooking?

Thanks
vwphillips
07-28-2006, 11:28 AM
// ***** Initialisation
// Each Slide Show must be initialised from a <BODY> or window onload event
// e.g.
// <body onload="zxcOOPSlideShow('fred','',2000,2);">


or post a link to your code

should have said

welcome
Brady h
07-28-2006, 11:45 AM
I used the <body onload....>
sorry cant link .not published
4637
vwphillips
07-28-2006, 12:20 PM
just tested using my images and its fine.

may be the size of your images.

how large are they in KByte?

if large they may need preloading prior to initialising the script


I'm sure we can fix

edit


but there again if you are using this locally it should not make a difference, will have to think

edit again

can you zip your images and post
Brady h
07-28-2006, 12:27 PM
hmmm
The images range from between 2.6 to 3.4 Kb.
vwphillips
07-28-2006, 12:38 PM
can you zip and post your images

and run this and let me know the text box values

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html >
<head>

<title>Untitled Document</title>

<script language="JavaScript" type="text/javascript">



// **** Functional Code - NO NEED to Change

function zxcSSImg(zxcid,zxcd,zxcnu){
var zxcoop=window['zxcSS'+zxcid];
if (!window['zxcSS'+zxcid]){ return; }
clearTimeout(zxcoop.to);
if (zxcnu){ if (zxcnu<1||zxcnu>=zxcoop.imgary.length){ return; }; zxcoop.cnt=zxcnu-1; zxcoop.d=0; zxcoop.next(); }
else if (zxcd==1||zxcd==-1){ zxcoop.d=zxcd; zxcoop.next(); }
else if (!zxcnu) { zxcoop.auto(); }
}

function zxcOOPSlideShow(zxcid,zxcmd,zxcdly,zxcfirst){
document.Show.Show0.value=vic++;
if (window['zxcSS'+zxcid]){ return; }
document.Show.Show1.value=vic++;
window['zxcSS'+zxcid]=new zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst);
}

function zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst){
document.Show.Show2.value=vic++;
var zxcp=document.getElementById(zxcid);
var zxcimgs=zxcp.getElementsByTagName('IMG');
document.Show.Show3.value=zxcimgs.length;
if (!zxcimgs){ return; }
document.Show.Show4.value=vic++;
this.imgary=[];
for (var zxc0=0;zxc0<zxcimgs.length;zxc0++){vic++; zxcSSStyle(zxcimgs[zxc0],{position:'absolute',zIndex:'0',left:'0px',top:'0px'}); this.imgary.push(zxcimgs[zxc0]); }
document.Show.Show5.value=vic++;
if (zxcmd.match('R')){ this.imgary=this.imgary.randomise(); }
this.ref='zxcSS'+zxcid;
window[this.ref]=this;
this.to=null
this.dly=zxcdly||1000;
this.d=1;
this.cnt=zxcfirst||1;
this.cnt--;
this.lst=zxcimgs[this.cnt];
this.lst.style.zIndex='1';
if (zxcmd.match('A')){ this.auto(); }
document.Show.Show6.value=vic++;
}

zxcSSOOP.prototype.next=function(){
this.cnt+=this.d;
if (this.cnt==this.imgary.length){ this.cnt=0; }
if (this.cnt<0){ this.cnt=this.imgary.length-1; }
this.lst.style.zIndex='0';
this.imgary[this.cnt].style.zIndex='1';
this.lst=this.imgary[this.cnt];
this.d=this.d||1;
}

zxcSSOOP.prototype.auto=function(){
this.next();
this.setTimeOut('auto()',this.dly);
}

zxcSSOOP.prototype.setTimeOut=function(zxcf,zxcd){
this.to=setTimeout('window.'+this.ref+'.'+zxcf,zxcd);
}

Array.prototype.randomise=function(){
this.cnt=0; this.ta=[];
while (this.cnt<this.length){ zxctmp=Math.floor(Math.random()*this.length-1)+1; if (!this.ta[zxctmp]){this.ta[zxctmp]=this[this.cnt]; this.cnt++; } }
return this.ta;
}

function zxcSSStyle(zxcele,zxcstyle){
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
}


//-->
</script>
</head>

<body onload="zxcOOPSlideShow('TstSS1','',2000,1);zxcOOPSlideShow('TstSS2','RA');">

<div id="TstSS1" style="position: relative; width:100px; height:64px;">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" width="100" height="64">
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS1',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS1')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS1',-1)"><br>
<img src="capepoint.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,1)" >
<img src="capetown.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,2)" >
<img src="cableway.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,3)" >
<img src="capetown1.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,4)" >
<br>
<img src="clifton.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,5)" >
<img src="cticc.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,6)" >
<img src="bakoven.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,7)" >
<img src="beach.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,8)" >
<br>
<br>
<div id="TstSS2" style="position: relative; width:100px; height:50px;" >
<img src="capegrace1.jpg" >
<img src="farm2.jpg" >
<img src="farm.jpg" >
<img src="tableview.jpg" >
<img src="thebays.jpg" >
<img src="waterfront.jpg" >
<img src="waterfront1.jpg" >
<img src="waterfront2.jpg" >
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS2',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS2')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS2',-1)">
<script> vic=0; </script>
<form name=Show id=Show style="position:absolute;visibility:visible;top:450px;left:0px;" >
<input size=10 name=Show0 >
<input size=10 name=Show1 >
<input size=10 name=Show2 >
<input size=10 name=Show3 >
<input size=10 name=Show4 >
<input size=10 name=Show5 >
<input size=10 name=Show6 >
<input size=10 name=Show7 >
<input size=10 name=Show8 >
<input size=10 name=Show9 >
</form>

</body>
</html>


also

It is important that the credits are left intact
// Simple Slide Show OOP (27-July-2006)
// by Vic Phillips http://www.vicsjavascripts.org.uk
Brady h
07-28-2006, 12:39 PM
image attachement
4638
Brady h
07-28-2006, 12:47 PM
Text box values 0 1 2 8 3 Blank etc
vwphillips
07-28-2006, 01:15 PM
using the limited number of images you ziped

it worked fine

but the tb numbers identified where it stopped for you

try this and let me know the text box numbers

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html >
<head>

<title>Untitled Document</title>

<script language="JavaScript" type="text/javascript">
// Simple Slide Show OOP (27-July-2006)
// by Vic Phillips http://www.vicsjavascripts.org.uk


// **** Functional Code - NO NEED to Change

function zxcSSImg(zxcid,zxcd,zxcnu){
var zxcoop=window['zxcSS'+zxcid];
if (!window['zxcSS'+zxcid]){ return; }
clearTimeout(zxcoop.to);
if (zxcnu){ if (zxcnu<1||zxcnu>=zxcoop.imgary.length){ return; }; zxcoop.cnt=zxcnu-1; zxcoop.d=0; zxcoop.next(); }
else if (zxcd==1||zxcd==-1){ zxcoop.d=zxcd; zxcoop.next(); }
else if (!zxcnu) { zxcoop.auto(); }
}

function zxcOOPSlideShow(zxcid,zxcmd,zxcdly,zxcfirst){
document.Show.Show0.value=vic++;
if (window['zxcSS'+zxcid]){ return; }
document.Show.Show1.value=vic++;
window['zxcSS'+zxcid]=new zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst);
}

function zxcSSOOP(zxcid,zxcmd,zxcdly,zxcfirst){
document.Show.Show2.value=vic++;
var zxcp=document.getElementById(zxcid);
var zxcimgs=zxcp.getElementsByTagName('IMG');
document.Show.Show3.value=zxcimgs.length;
if (!zxcimgs){ return; }
document.Show.Show4.value=vic++;
this.imgary=[];
for (var zxc0=0;zxc0<zxcimgs.length;zxc0++){
vic++;
zxcimgs[zxc0].style.position='absolute';
zxcimgs[zxc0].style.zIndex='0';
zxcimgs[zxc0].style.left='0px';
zxcimgs[zxc0].style.top='0px';
this.imgary.push(zxcimgs[zxc0]);
}
document.Show.Show5.value=vic++;
if (zxcmd.match('R')){ this.imgary=this.imgary.randomise(); }
this.ref='zxcSS'+zxcid;
window[this.ref]=this;
this.to=null
this.dly=zxcdly||1000;
this.d=1;
this.cnt=zxcfirst||1;
this.cnt--;
this.lst=zxcimgs[this.cnt];
this.lst.style.zIndex='1';
if (zxcmd.match('A')){ this.auto(); }
document.Show.Show6.value=vic++;
}

zxcSSOOP.prototype.next=function(){
this.cnt+=this.d;
if (this.cnt==this.imgary.length){ this.cnt=0; }
if (this.cnt<0){ this.cnt=this.imgary.length-1; }
this.lst.style.zIndex='0';
this.imgary[this.cnt].style.zIndex='1';
this.lst=this.imgary[this.cnt];
this.d=this.d||1;
}

zxcSSOOP.prototype.auto=function(){
this.next();
this.setTimeOut('auto()',this.dly);
}

zxcSSOOP.prototype.setTimeOut=function(zxcf,zxcd){
this.to=setTimeout('window.'+this.ref+'.'+zxcf,zxcd);
}

Array.prototype.randomise=function(){
this.cnt=0; this.ta=[];
while (this.cnt<this.length){ zxctmp=Math.floor(Math.random()*this.length-1)+1; if (!this.ta[zxctmp]){this.ta[zxctmp]=this[this.cnt]; this.cnt++; } }
return this.ta;
}

function zxcSSStyle(zxcele,zxcstyle){
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
}


//-->
</script>
</head>

<body onload="zxcOOPSlideShow('TstSS1','',2000,1);zxcOOPSlideShow('TstSS2','RA');">

<div id="TstSS1" style="position: relative; width:100px; height:64px;">
<img src="bakoven1.jpg" width="100" height="64">
<img src="bakoven.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
<img src="clifton.jpg" width="100" height="64">
<img src="beach.jpg" width="100" height="64">
<img src="capepoint.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS1',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS1')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS1',-1)"><br>
<img src="capepoint.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,1)" >
<img src="capetown.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,2)" >
<img src="cableway.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,3)" >
<img src="capetown1.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,4)" >
<br>
<img src="clifton.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,5)" >
<img src="cticc.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,6)" >
<img src="bakoven.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,7)" >
<img src="beach.jpg" width="25" height="13" onclick="zxcSSImg('TstSS1',0,8)" >
<br>
<br>
<div id="TstSS2" style="position: relative; width:100px; height:50px;" >
<img src="bakoven1.jpg" width="100" height="64">
<img src="bakoven.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
<img src="clifton.jpg" width="100" height="64">
<img src="beach.jpg" width="100" height="64">
<img src="capepoint.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
<img src="capetown.jpg" width="100" height="64">
</div>
<input type="button" name="" value="Next" onclick="zxcSSImg('TstSS2',1)">
<input type="button" name="" value="Auto" onclick="zxcSSImg('TstSS2')">
<input type="button" name="" value="Last" onclick="zxcSSImg('TstSS2',-1)">
<script> vic=0; </script>
<form name=Show id=Show style="position:absolute;visibility:visible;top:450px;left:0px;" >
<input size=10 name=Show0 >
<input size=10 name=Show1 >
<input size=10 name=Show2 >
<input size=10 name=Show3 >
<input size=10 name=Show4 >
<input size=10 name=Show5 >
<input size=10 name=Show6 >
<input size=10 name=Show7 >
<input size=10 name=Show8 >
<input size=10 name=Show9 >
</form>
<br>
Text box values 0 1 2 8 3 Blank etc
</body>
</html>
Brady h
07-28-2006, 03:05 PM
yee ha!!
Its starting to pull through.
Nice one!!

the tb no's

14 15 16 8 17 26 27 blank etc

Thanks for all the effort Vic!

p.s why would it work your side and not here?
vwphillips
07-28-2006, 05:13 PM
why would it work your side and not here?

that a bit of a worry as I use the replaced zxcStyle function alot to save code

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum