Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Aug 2005
    Posts
    365
    Thanks
    7
    Thanked 1 Time in 1 Post

    Question How to create a slideshow like this one???

    Go to http://www.shaadi.com
    There's a slideshow on right side. Its a freeware image slideshow with description & control buttons. Someone please tell me where I can find this slideshow(opensource)? OR is there any similar FREE SlideShow script? Please let me know.

    Thanks

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    Code:
    <!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>
    <style type="text/css">
    /*<![CDATA[*/
    #Tst {
      width:200px;height:100px;border:solid black 1px;
    }
    .Controls{
      position:absolute;left:60px;top:80px;z-Index:2;width:80px;height:'20px';background-Color:blue;
    }
    
    /*]]>*/
    </style>
    <script language="JavaScript" type="text/javascript">
    <!--
    // Element Animator (06-March-2007) DRAFT
    // by Vic Phillips http://www.vicsjavascripts.org.uk
    
    // To progressively change the Left, Top, Width, Height, Color, Opacity style
    // (or otherproperties) of an element over a specified period of time.
    
    // **** Application Notes
    
    // **** The HTML Code
    //
    // when moving an element the inline or class rule style position of the element should be assigned as
    // 'position:relative;' or 'position:absolute;'
    // If not assigned the style position of the element will be assigned as 'position:absolute;' by the script.
    //
    // The element would normally be assigned a unique ID name.
    //
    
    // **** Executing the Effect(Script)
    //
    // The effect is executed by an event call to function 'zxcChangeLTWHCO('left','tst1',20,260,2000);'
    // where:
    // parameter 0 = 'left', 'top', 'width', 'height', 'color', 'background-Color', 'opacity' etc.             (string)
    //               Note: the first character after the hyphen must be be upper case, all others lower case.
    //                     With the exception of opacity and color the property value units is in 'px'.
    // parameter 1 = the unique ID name or element object.                                                     (string or element object)
    // parameter 2 = the start position of the effect.                                                         (digits, for opacity minimum 0, maximum 100)
    // parameter 3 = the finish position of the effect.                                                        (digits, for opacity minimum 0, maximum 100)
    // parameter 4 = (optional) there are two types of progressive change 'sin' and 'cos' plus a liner change. ('sin', 'cos' or liner, defaults to liner)
    //                'sin' progression starts fast and ends slow.
    //                'cos' progression starts slow and ends fast.
    // parameter 5 = (optional) period of time between the start and finish of the effect in milliseconds.     (digits or defaults to 2000 milliSeconds)
    //
    //  The function may be re-executed with a different set of parameters (start/finish time, progression type or period)
    //  whenever required, say from an onclick/mouseover/out event. The original progression type and period parameters
    //  will be retained unless re-specified, the start and finish parameters must be specified.
    //
    
    // **** General
    //
    // All variable, function etc. names are prefixed with 'zxc' to minimise conflicts with other JavaScripts.
    // These characters may be changed to characters of choice using global find and replace.
    //
    // The Functional Code (about 3.7K) is best as an External JavaScript.
    //
    // Tested with IE7 and Mozilla FireFox on a PC.
    //
    
    
    
    // **** Functional Code - NO NEED to Change
    
    var zxcOOPCnt=0;
    
    function zxcAnimator(zxcmde,zxcobj,zxcsrt,zxcfin,zxccurve,zxctime,zxcplot){
     if (typeof(zxcobj)=='string'){ zxcobj=document.getElementById(zxcobj); }
     if (!zxcobj||(!zxcsrt&&!zxcfin)) return;
     var zxcoop=zxcobj[zxcmde.replace('-','')+'oop'];
     if (zxcoop) zxcoop.cngparameters(zxcmde,[zxcsrt,zxcfin],zxccurve,zxctime,zxcplot);
     else zxcobj[zxcmde.replace('-','')+'oop']=new zxcAnimatorOOP(zxcmde,zxcobj,[zxcsrt,zxcfin],zxccurve,zxctime,zxcplot);
    }
    
    function zxcAnimatorOOP(zxcmde,zxcobj,zxcsrtfin,zxccurve,zxctime,zxcplot){
     if (zxcsrtfin[0]==zxcsrtfin[1]) return;
     if (zxcStyleValue(zxcobj,'position')=='static'&&(zxcmde=='left'||zxcmde=='top')) zxcobj.style.position='absolute';
     this.to=null;
     this.ref='zxcltwhco'+zxcOOPCnt++;
     window[this.ref]=this;
     this.obj=zxcobj;
     this.cngparameters(zxcmde,zxcsrtfin,zxccurve,zxctime,zxcplot);
    }
    
    zxcAnimatorOOP.prototype.cngparameters=function(zxcmde,zxcsrtfin,zxccurve,zxctime,zxcplot){
     clearTimeout(this.to);
     this.mde=this.mde||zxcmde;
     zxccurve=zxccurve||this.curve||'';
     this.time=zxctime||this.time||2000;
     if (zxcsrtfin[0]==zxcsrtfin[1]) return;
     for (var zxc0=0;zxc0<zxcsrtfin.length;zxc0++){
      var zxcobj=document.getElementById(zxcsrtfin[zxc0]);
      if (zxcobj){ zxcsrtfin[zxc0]=zxcStyleValue(zxcobj,zxcmde); if (!this.mde.match('olor')) zxcsrtfin[zxc0]=parseInt(zxcsrtfin[zxc0]); }
      if (zxcsrtfin[zxc0]==0) zxcsrtfin[zxc0]=0.00001;
     }
     if (this.mde=='opacity'&&(zxcsrtfin[0]<0||zxcsrtfin[0]>100||zxcsrtfin[0]<0||zxcsrtfin[0]>100)) return;
     this.curve=zxccurve.charAt(0).toLowerCase();
     this.sf=[(!zxcmde.match('olor'))?[zxcsrtfin[0]]:zxcRGBSplit(zxcsrtfin[0]),(!zxcmde.match('olor'))?[zxcsrtfin[1]]:zxcRGBSplit(zxcsrtfin[1]),[]];
     this.srttime=new Date().getTime();
     this.inc=Math.PI/(2*this.time);
     this.cngltwhco();
    }
    
    zxcAnimatorOOP.prototype.cngltwhco=function(){
     var zxcms=new Date().getTime()-this.srttime;
     for (var zxc0 in this.sf[1]){ this.sf[2][zxc0]=(this.curve=='s')?Math.floor((this.sf[1][zxc0]-this.sf[0][zxc0])*Math.sin(this.inc*zxcms)+this.sf[0][zxc0]):(this.curve=='c')?(this.sf[1][0])-Math.floor((this.sf[1][zxc0]-this.sf[0][zxc0])*Math.cos(this.inc*zxcms)):(this.sf[1][zxc0]-this.sf[0][zxc0])/this.time*zxcms+this.sf[0][zxc0]; }
     this.cngstyle(this.sf[2]);
     if (zxcms<this.time) this.setTimeOut('cngltwhco();',10);
     else this.cngstyle(this.sf[1]);
    }
    
    zxcAnimatorOOP.prototype.cngstyle=function(zxcltwhco){
     if (this.mde.match('olor')) this.obj.style[this.mde.replace('-','')]='rgb('+zxcltwhco[0]+','+zxcltwhco[1]+','+zxcltwhco[2]+')';
     else if (this.mde!='opacity') this.obj.style[this.mde.replace('-','')]=zxcltwhco[0]+'px';
     else this.opacity(zxcltwhco[0]);
    }
    
    zxcAnimatorOOP.prototype.opacity=function(zxcopc){
     if (zxcopc<0||zxcopc>100) return;
     if (this.obj.style.MozOpacity!=null) this.obj.style.MozOpacity=(zxcopc/100)-.001;
     else if (this.obj.style.opacity!=null) this.obj.style.opacity=(zxcopc/100)-.001;
     else if (this.obj.style.filter!=null) this.obj.style.filter='alpha(opacity='+zxcopc+')';
     else if (this.obj.KHTMLOpacity!=null) this.obj.KHTMLOpacity=(zxcopc/100)-.001;
    }
    
    zxcAnimatorOOP.prototype.setTimeOut=function(zxcf,zxcd){
     this.to=setTimeout('window.'+this.ref+'.'+zxcf,zxcd);
    }
    
    function zxcStyleValue(zxcel,zxcp){
     if (zxcel.currentStyle) return zxcel.currentStyle[zxcp.replace('-','')];
     return document.defaultView.getComputedStyle(zxcel,null).getPropertyValue(zxcp.toLowerCase());
    }
    
    function zxcRGBSplit(zxccol){
     if (zxccol.match('#')){ zxccol=parseInt(zxccol.substring(1,3),16)+','+parseInt(zxccol.substring(3,5),16)+','+parseInt(zxccol.substring(5,7),16); }
     zxccol=zxccol.replace(/[rgb()\s]/g,'').split(',');
     return [parseInt(zxccol[0]),parseInt(zxccol[1]),parseInt(zxccol[2])];
    }
    
    
    //-->
    </script>
    
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    function zxcInitSlideSS(zxcid,zxcspd){
     var zxcp=document.getElementById(zxcid);
     var zxcclds=zxcObjTxtNodes(zxcp);
     zxcES(zxcp,{position:(zxcStyleValue(zxcp,'position')=='absolute')?'absolute':'relative',overflow:'hidden'});
     zxcp.slide=zxcES('DIV',{position:'absolute',left:'0px',top:'0px',width:'100px',height:zxcStyleValue(zxcp,'height')},zxcp);
     var zxcw=parseInt(zxcStyleValue(zxcp,'width'));
     for (var zxc0=0;zxc0<zxcclds.length-1;zxc0++){
      zxcES(zxcclds[zxc0],{position:'absolute',left:(zxcw*zxc0)+'px',top:'0px',width:zxcw+'px',height:zxcStyleValue(zxcp,'height')},zxcp.slide);
     }
     zxcES(zxcp.slide,{width:(zxcw*zxc0)+'px'});
     zxcp.slide.cnt=0;
     zxcp.slide.spd=zxcspd||1000;
    }
    
    function zxcSlide(zxcid,zxclr){
     var zxcp=document.getElementById(zxcid).slide;
     var zxcslides=zxcp.childNodes
     zxcp.cnt+=zxclr;
     zxcp.cnt=(zxcp.cnt<0)?0:(zxcp.cnt>zxcslides.length-1)?zxcslides.length-1:zxcp.cnt;
     zxcAnimator('left',zxcp,parseInt(zxcp.style.left),-parseInt(zxcslides[zxcp.cnt].style.left),'sin',zxcp.spd);
    }
    
    function zxcES(zxcele,zxcstyle,zxcp,zxctxt){
     if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
     for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
     if (zxcp){ zxcp.appendChild(zxcele); }
     if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
     return zxcele;
    }
    
    function zxcObjTxtNodes(zxcp,zxckp){
     var zxcclds=zxcp.childNodes,zxctxt=[],zxcobjs=[];
     for (var zxca=0;zxca<zxcclds.length;zxca++){ if (zxcclds[zxca].nodeType==1) zxcobjs.push(zxcclds[zxca]); else zxctxt.push(zxcclds[zxca]); }
     if (!zxckp){ for (var zxcb=0;zxcb<zxctxt.length;zxcb++){ zxcp.removeChild(zxctxt[zxcb]); }  return zxcobjs; }
     return [zxcobjs,zxctxt];
    }
    
    function zxcStyleValue(zxcobj,zxcp){ //  pass object and property, returns property value
     if (zxcobj.currentStyle) return zxcobj.currentStyle[zxcp.replace('-','')];
     return document.defaultView.getComputedStyle(zxcobj,null).getPropertyValue(zxcp.toLowerCase());
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body onload="zxcInitSlideSS('Tst',2000);">
    <div id="Tst" >
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div class="Controls">
    <input type="button" value="<<" onclick="zxcSlide('Tst',-1);" />
    <input type="button" value=">>" onclick="zxcSlide('Tst',1);" />
    </div>
    
    </div>
    
    
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    Code:
    <!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>
    <style type="text/css">
    /*<![CDATA[*/
    #Tst {
      width:300px;height:100px;border:solid black 1px;
    }
    .Controls{
      position:relative;left:60px;z-Index:2;width:80px;height:'20px';background-Color:blue;
    }
    
    /*]]>*/
    </style>
    <script language="JavaScript" type="text/javascript">
    <!--
    // Element Animator (06-March-2007) DRAFT
    // by Vic Phillips http://www.vicsjavascripts.org.uk
    
    // To progressively change the Left, Top, Width, Height, Color, Opacity style
    // (or otherproperties) of an element over a specified period of time.
    
    // **** Application Notes
    
    // **** The HTML Code
    //
    // when moving an element the inline or class rule style position of the element should be assigned as
    // 'position:relative;' or 'position:absolute;'
    // If not assigned the style position of the element will be assigned as 'position:absolute;' by the script.
    //
    // The element would normally be assigned a unique ID name.
    //
    
    // **** Executing the Effect(Script)
    //
    // The effect is executed by an event call to function 'zxcChangeLTWHCO('left','tst1',20,260,2000);'
    // where:
    // parameter 0 = 'left', 'top', 'width', 'height', 'color', 'background-Color', 'opacity' etc.             (string)
    //               Note: the first character after the hyphen must be be upper case, all others lower case.
    //                     With the exception of opacity and color the property value units is in 'px'.
    // parameter 1 = the unique ID name or element object.                                                     (string or element object)
    // parameter 2 = the start position of the effect.                                                         (digits, for opacity minimum 0, maximum 100)
    // parameter 3 = the finish position of the effect.                                                        (digits, for opacity minimum 0, maximum 100)
    // parameter 4 = (optional) there are two types of progressive change 'sin' and 'cos' plus a liner change. ('sin', 'cos' or liner, defaults to liner)
    //                'sin' progression starts fast and ends slow.
    //                'cos' progression starts slow and ends fast.
    // parameter 5 = (optional) period of time between the start and finish of the effect in milliseconds.     (digits or defaults to 2000 milliSeconds)
    //
    //  The function may be re-executed with a different set of parameters (start/finish time, progression type or period)
    //  whenever required, say from an onclick/mouseover/out event. The original progression type and period parameters
    //  will be retained unless re-specified, the start and finish parameters must be specified.
    //
    
    // **** General
    //
    // All variable, function etc. names are prefixed with 'zxc' to minimise conflicts with other JavaScripts.
    // These characters may be changed to characters of choice using global find and replace.
    //
    // The Functional Code (about 3.7K) is best as an External JavaScript.
    //
    // Tested with IE7 and Mozilla FireFox on a PC.
    //
    
    
    
    // **** Functional Code - NO NEED to Change
    
    var zxcOOPCnt=0;
    
    function zxcAnimator(zxcmde,zxcobj,zxcsrt,zxcfin,zxccurve,zxctime,zxcplot){
     if (typeof(zxcobj)=='string'){ zxcobj=document.getElementById(zxcobj); }
     if (!zxcobj||(!zxcsrt&&!zxcfin)) return;
     var zxcoop=zxcobj[zxcmde.replace('-','')+'oop'];
     if (zxcoop) zxcoop.cngparameters(zxcmde,[zxcsrt,zxcfin],zxccurve,zxctime,zxcplot);
     else zxcobj[zxcmde.replace('-','')+'oop']=new zxcAnimatorOOP(zxcmde,zxcobj,[zxcsrt,zxcfin],zxccurve,zxctime,zxcplot);
    }
    
    function zxcAnimatorOOP(zxcmde,zxcobj,zxcsrtfin,zxccurve,zxctime,zxcplot){
     if (zxcsrtfin[0]==zxcsrtfin[1]) return;
     if (zxcStyleValue(zxcobj,'position')=='static'&&(zxcmde=='left'||zxcmde=='top')) zxcobj.style.position='absolute';
     this.to=null;
     this.ref='zxcltwhco'+zxcOOPCnt++;
     window[this.ref]=this;
     this.obj=zxcobj;
     this.cngparameters(zxcmde,zxcsrtfin,zxccurve,zxctime,zxcplot);
    }
    
    zxcAnimatorOOP.prototype.cngparameters=function(zxcmde,zxcsrtfin,zxccurve,zxctime,zxcplot){
     clearTimeout(this.to);
     this.mde=this.mde||zxcmde;
     zxccurve=zxccurve||this.curve||'';
     this.time=zxctime||this.time||2000;
     if (zxcsrtfin[0]==zxcsrtfin[1]) return;
     for (var zxc0=0;zxc0<zxcsrtfin.length;zxc0++){
      var zxcobj=document.getElementById(zxcsrtfin[zxc0]);
      if (zxcobj){ zxcsrtfin[zxc0]=zxcStyleValue(zxcobj,zxcmde); if (!this.mde.match('olor')) zxcsrtfin[zxc0]=parseInt(zxcsrtfin[zxc0]); }
      if (zxcsrtfin[zxc0]==0) zxcsrtfin[zxc0]=0.00001;
     }
     if (this.mde=='opacity'&&(zxcsrtfin[0]<0||zxcsrtfin[0]>100||zxcsrtfin[0]<0||zxcsrtfin[0]>100)) return;
     this.curve=zxccurve.charAt(0).toLowerCase();
     this.sf=[(!zxcmde.match('olor'))?[zxcsrtfin[0]]:zxcRGBSplit(zxcsrtfin[0]),(!zxcmde.match('olor'))?[zxcsrtfin[1]]:zxcRGBSplit(zxcsrtfin[1]),[]];
     this.srttime=new Date().getTime();
     this.inc=Math.PI/(2*this.time);
     this.cngltwhco();
    }
    
    zxcAnimatorOOP.prototype.cngltwhco=function(){
     var zxcms=new Date().getTime()-this.srttime;
     for (var zxc0 in this.sf[1]){ this.sf[2][zxc0]=(this.curve=='s')?Math.floor((this.sf[1][zxc0]-this.sf[0][zxc0])*Math.sin(this.inc*zxcms)+this.sf[0][zxc0]):(this.curve=='c')?(this.sf[1][0])-Math.floor((this.sf[1][zxc0]-this.sf[0][zxc0])*Math.cos(this.inc*zxcms)):(this.sf[1][zxc0]-this.sf[0][zxc0])/this.time*zxcms+this.sf[0][zxc0]; }
     this.cngstyle(this.sf[2]);
     if (zxcms<this.time) this.setTimeOut('cngltwhco();',10);
     else this.cngstyle(this.sf[1]);
    }
    
    zxcAnimatorOOP.prototype.cngstyle=function(zxcltwhco){
     if (this.mde.match('olor')) this.obj.style[this.mde.replace('-','')]='rgb('+zxcltwhco[0]+','+zxcltwhco[1]+','+zxcltwhco[2]+')';
     else if (this.mde!='opacity') this.obj.style[this.mde.replace('-','')]=zxcltwhco[0]+'px';
     else this.opacity(zxcltwhco[0]);
    }
    
    zxcAnimatorOOP.prototype.opacity=function(zxcopc){
     if (zxcopc<0||zxcopc>100) return;
     if (this.obj.style.MozOpacity!=null) this.obj.style.MozOpacity=(zxcopc/100)-.001;
     else if (this.obj.style.opacity!=null) this.obj.style.opacity=(zxcopc/100)-.001;
     else if (this.obj.style.filter!=null) this.obj.style.filter='alpha(opacity='+zxcopc+')';
     else if (this.obj.KHTMLOpacity!=null) this.obj.KHTMLOpacity=(zxcopc/100)-.001;
    }
    
    zxcAnimatorOOP.prototype.setTimeOut=function(zxcf,zxcd){
     this.to=setTimeout('window.'+this.ref+'.'+zxcf,zxcd);
    }
    
    function zxcStyleValue(zxcel,zxcp){
     if (zxcel.currentStyle) return zxcel.currentStyle[zxcp.replace('-','')];
     return document.defaultView.getComputedStyle(zxcel,null).getPropertyValue(zxcp.toLowerCase());
    }
    
    function zxcRGBSplit(zxccol){
     if (zxccol.match('#')){ zxccol=parseInt(zxccol.substring(1,3),16)+','+parseInt(zxccol.substring(3,5),16)+','+parseInt(zxccol.substring(5,7),16); }
     zxccol=zxccol.replace(/[rgb()\s]/g,'').split(',');
     return [parseInt(zxccol[0]),parseInt(zxccol[1]),parseInt(zxccol[2])];
    }
    
    
    //-->
    </script>
    
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    function zxcInitSlideSS(zxcid,zxcnu,zxcspd){
     var zxcp=document.getElementById(zxcid);
     var zxcclds=zxcObjTxtNodes(zxcp);
     zxcES(zxcp,{position:(zxcStyleValue(zxcp,'position')=='absolute')?'absolute':'relative',overflow:'hidden'});
     zxcp.slide=zxcES('DIV',{position:'absolute',left:'0px',top:'0px',width:'100px',height:zxcStyleValue(zxcp,'height')},zxcp);
     zxcp.slide.spd=zxcspd||1000;
     zxcp.slide.cnt=0;
     var zxcw=parseInt(zxcStyleValue(zxcp,'width'))/zxcnu;
     for (var zxc0=0;zxc0<zxcclds.length;zxc0++){
      zxcES(zxcclds[zxc0],{position:'absolute',left:(zxcw*zxc0)+'px',top:'0px',width:zxcw+'px',height:zxcStyleValue(zxcp,'height')},zxcp.slide);
     }
     zxcES(zxcp.slide,{width:(zxcw*zxc0)+'px'});
    }
    
    function zxcSlide(zxcid,zxclr){
     var zxcp=document.getElementById(zxcid).slide;
     var zxcslides=zxcp.childNodes;
     zxcp.cnt+=zxclr;
     zxcp.cnt=(zxcp.cnt<0)?0:(zxcp.cnt>zxcslides.length-1)?zxcslides.length-1:zxcp.cnt;
     zxcAnimator('left',zxcp,parseInt(zxcp.style.left),-parseInt(zxcslides[zxcp.cnt].style.left),'sin',zxcp.spd);
    }
    
    function zxcImgClick(zxcobj,zxcid,zxcnu){
     var zxcimgs=zxcobj.parentNode.getElementsByTagName('IMG');
     var zxcp=document.getElementById(zxcid).slide;
     var zxcslides=zxcp.childNodes;
     for (var zxc0=0;zxc0<zxcimgs.length;zxc0++){
      zxcimgs[zxc0].src=(zxcimgs[zxc0]==zxcobj)?'http://www.vicsjavascripts.org.uk/StdImages/One.gif':'http://www.vicsjavascripts.org.uk/StdImages/Zero.gif';
      if (zxcimgs[zxc0]==zxcobj){
       zxcp.cnt=(zxcnu*zxc0);
       zxcAnimator('left',zxcp,parseInt(zxcp.style.left),-parseInt(zxcslides[zxcp.cnt].style.left),'sin',zxcp.spd);
      }
     }
    }
    
    function zxcES(zxcele,zxcstyle,zxcp,zxctxt){
     if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
     for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
     if (zxcp){ zxcp.appendChild(zxcele); }
     if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
     return zxcele;
    }
    
    function zxcObjTxtNodes(zxcp,zxckp){
     var zxcclds=zxcp.childNodes,zxctxt=[],zxcobjs=[];
     for (var zxca=0;zxca<zxcclds.length;zxca++){ if (zxcclds[zxca].nodeType==1) zxcobjs.push(zxcclds[zxca]); else zxctxt.push(zxcclds[zxca]); }
     if (!zxckp){ for (var zxcb=0;zxcb<zxctxt.length;zxcb++){ zxcp.removeChild(zxctxt[zxcb]); }  return zxcobjs; }
     return [zxcobjs,zxctxt];
    }
    
    function zxcStyleValue(zxcobj,zxcp){ //  pass object and property, returns property value
     if (zxcobj.currentStyle) return zxcobj.currentStyle[zxcp.replace('-','')];
     return document.defaultView.getComputedStyle(zxcobj,null).getPropertyValue(zxcp.toLowerCase());
    }
    
    
    /*]]>*/
    </script>
    
    </head>
    
    <body onload="zxcInitSlideSS('Tst',2,2000);">
    <div>
    <img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" height="20" width="20" onclick="zxcImgClick(this,'Tst',2);">
    <img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" height="20" width="20" onclick="zxcImgClick(this,'Tst',2);" >
    <img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" height="20" width="20" onclick="zxcImgClick(this,'Tst',2);">
    <img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" height="20" width="20" onclick="zxcImgClick(this,'Tst',2);" >
    </div>
    <div id="Tst" >
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Three.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Four.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Five.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Six.gif" height="100" width="50" ></div>
    <div style="text-Align:center;" ><img src="http://www.vicsjavascripts.org.uk/StdImages/Seven.gif" height="100" width="50" ></div>
    </div>
    <div class="Controls">
    <input type="button" value="<<" onclick="zxcSlide('Tst',-2);" />
    <input type="button" value=">>" onclick="zxcSlide('Tst',2);" />
    </div>
    
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •