Results 1 to 4 of 4

Thread: Blending Image slideshow script help

  1. #1
    Join Date
    Aug 2006
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Blending Image slideshow script help

    Blending Image slideshow script help

    http://www.dynamicdrive.com/dynamicindex14/image4.htm

    Hi dumb question but I can this script be changed to add more than three images I have tried to add some more with no success

    I normally can follow scripts quite well but this one does not seem to let me


    thanks
    Dawn

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default Here ya go dawn

    I find that tutorial very confusing as well. Here is a very easily customizable image slideshow.

    Put this in your <head> script
    Code:
    <script type="text/javascript">
    // <![CDATA[
    var interval = 1;	// Change this interval depending on how long you want in between images
    var current = 0;
    var pick = 0;
    if (document.images) {						// Preload Images to use for the slideshow
    	var slides = new Array();				// Just add a new slide and the assosiated link to it
    		slides[0] = new Image()				// To customize your images... Doesnt matter how many 
    			slides[0].src = "images1.gif";	// just as long as it has a minimum of 2
    		slides[1] = new Image()
    			slides[1].src = "images2.gif";
    		slides[2] = new Image()
    			slides[2].src = "images3.gif";
    		slides[3] = new Image()
    			slides[3].src = "images4.gif";
    		slides[4] = new Image()
    			slides[4].src = "images5.gif";
    		slides[5] = new Image()
    			slides[5].src = "images6.gif";
    		slides[6] = new Image()
    			slides[6].src = "images7.gif";
    		slides[7] = new Image()
    			slides[7].src = "images8.gif";
    }
    
    function next() {				// Tells the computer what image is going to be next in the slideshow
    	if(document.images && document.slideshow.complete) {
    		if(current == slides.length) { 
    			current = 0;
    		}
    		document.slideshow.src = slides[current].src;
    		current++;
    	}
    }
    
    function show() {		// Starts a default slideshow with interval of 1 second
    	slideShow = setInterval("next()", interval*1000);
    }
    // ]]>
    </script>

    Put this in your <body> tag where you want your slideshow to appear
    Code:
    <form action="#">
    		<img src="images/images1.gif" id="slideshow" height="200" width="200" alt="slideshow" />
    		<br />
    		<input type="button" value="Start Show" onclick="show()" />
    		<input type="button" value="Stop Show" onclick="clearInterval(slideShow);'" />
    </form>
    where images/images1.gif is the link for the image you want displayed first and dont forget to change the height and width of your image to fit the correct specifications. the start show and stop show buttons are added in as something i thought you might want to use.
    Hope this helps.

  3. #3
    Join Date
    Aug 2006
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you I will try this one

  4. #4
    Join Date
    Aug 2006
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi just tried it and changed my images in the head part ,then edited the body part as you stated and nope no luck pressed the start button and nothing happens got an error on page so not sure .
    Dawn

Bookmarks

Posting Permissions

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