Uncle Jim's Web Designs: Manual Selection Slide Show

Uncle Jim's Web Designs

Manual Selection Slide Show

Author: Jim Stiles

In this example, the user manually selects the previous or next image by clicking on text or buttons.
You can use an unlimited number of images. The images do not have to be the same size.

Back

Next

SCRIPT INSTALLATION

COPY - Insert Between Head Tags: <HEAD></HEAD>

<script type="text/Javascript"><!--
/*
 ______________________________________________________
/秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤\
|          Another JavaScript from Uncle Jim           |
|                                                      |
|   Feel free to copy, use and change this script as   |
|        long as this part remains unchanged.          |
|                                                      |
|      Visit my website at http://www.jdstiles.com     |
|           for more scripts like this one             |
|                                                      |
|                     Created: 1996                    |
|              Last Updated: December, 2005            |
\______________________________________________________/
 秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤秤
*/
var pictures = new Array ("http://YOURDOMAINcom/pic/CENTERPICTURE.jpg","http://YOURDOMAIN.com/pic/PICTURE2.jpg","http://YOURDOMAIN.com/pic/PICTURE3.jpg",
                          "http://YOURDOMAIN.com/pic/PICTURE4.jpg","http://YOURDOMAIN.com/pic/PICTURE5.jpg","http://YOURDOMAIN.com/pic/PICTURE6.jpg",
                          "http://YOURDOMAIN.com/pic/PICTURE7.jpg","http://YOURDOMAIN.com/pic/PICTURE8.jpg");
var pictureNumber = 0;
var totalNumber = pictures.length;

function previous(){
  if (document.images){
     if (pictureNumber > 0) pictureNumber--
     else             
     pictureNumber = totalNumber-1
     document.images.slides.src  = pictures[pictureNumber]
   }
}
 function next(){
  if (document.images){
     if (pictureNumber < totalNumber-1)  pictureNumber++
     else                    
     pictureNumber = 0
     document.images.slides.src  = pictures[pictureNumber]
   }
}

//--></SCRIPT>

COPY - Insert Inside Body: <BODY></BODY>

Additional Instructions:

Close This Window