www.webdeveloper.com
Results 1 to 2 of 2

Thread: Fading Slide Show

  1. #1
    Join Date
    Feb 2011
    Posts
    9

    Fading Slide Show

    Taken from JavaScript Source instructions http://javascript.internet.com/misce...lide-show.html. Inserted my image sources and had to change the width & height for my image sizes. Still doesn't work. Any help is greatly appreciated.

    <html>

    <head>

    <SCRIPT LANGUAGE="JavaScript">
    <!-- Original: CodeLifter.com (support@codelifter.com) -->
    <!-- Web Site: http://www.codelifter.com -->

    <!-- This script and many more are available free online at -->
    <!-- The JavaScript Source!! http://javascript.internet.com -->

    <!-- Begin
    // Set slideShowSpeed (milliseconds)
    var slideShowSpeed = 5000;
    // Duration of crossfade (seconds)
    var crossFadeDuration = 3;
    // Specify the image files
    var Pic = new Array();
    // to add more images, just continue
    // the pattern, adding to the array below

    Pic[0] = 'bravo-demo.com/images/Rotators/show/one3611.jpg'
    Pic[1] = 'bravo-demo.com/images/Rotators/show/two3611.jpg'
    Pic[2] = 'bravo-demo.com/images/Rotators/show/three3611.jpg'
    Pic[3] = 'bravo-demo.com/images/Rotators/show/four3611.jpg'

    // do not edit anything below this line
    var t;
    var j = 0;
    var p = Pic.length;
    var preLoad = new Array();
    for (i = 0; i < p; i++) {
    preLoad[i] = new Image();
    preLoad[i].src = Pic[i];
    }
    function runSlideShow() {
    if (document.all) {
    document.images.SlideShow.style.filter="blendTrans(duration=2)";
    document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
    document.images.SlideShow.filters.blendTrans.Apply();
    }
    document.images.SlideShow.src = preLoad[j].src;
    if (document.all) {
    document.images.SlideShow.filters.blendTrans.Play();
    }
    j = j + 1;
    if (j > (p - 1)) j = 0;
    t = setTimeout('runSlideShow()', slideShowSpeed);
    }
    // End -->
    </script>

    </head>

    <body onLoad="runSlideShow()">

    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td id="VU" height=240 width=431>
    <img src="1.jpg" name='SlideShow' width=431 height=240>
    </td>
    </tr>
    </table>

    <p><center>
    <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
    by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
    </center><p>

    <!-- Script Size: 2.13 KB -->

    </body>

    </html>

  2. #2
    Join Date
    Jun 2004
    Location
    Portsmouth UK
    Posts
    2,667
    check the images URL

    Code:
    <html>
    
    <head>
    
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Original: CodeLifter.com (support@codelifter.com) -->
    <!-- Web Site: http://www.codelifter.com -->
    
    <!-- This script and many more are available free online at -->
    <!-- The JavaScript Source!! http://javascript.internet.com -->
    
    <!-- Begin
    // Set slideShowSpeed (milliseconds)
    var slideShowSpeed = 5000;
    // Duration of crossfade (seconds)
    var crossFadeDuration = 3;
    // Specify the image files
    var Pic = new Array();
    // to add more images, just continue
    // the pattern, adding to the array below
    
    Pic[0] = 'http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg'
    Pic[1] = 'http://www.vicsjavascripts.org.uk/StdImages/Egypt6.jpg'
    Pic[2] = 'http://www.vicsjavascripts.org.uk/StdImages/Egypt7.jpg'
    Pic[3] = 'http://www.vicsjavascripts.org.uk/StdImages/Egypt8.jpg'
    
    // do not edit anything below this line
    var t;
    var j = 0;
    var p = Pic.length;
    var preLoad = new Array();
    for (i = 0; i < p; i++) {
    preLoad[i] = new Image();
    preLoad[i].src = Pic[i];
    }
    function runSlideShow() {
    if (document.all) {
    document.images.SlideShow.style.filter="blendTrans(duration=2)";
    document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
    document.images.SlideShow.filters.blendTrans.Apply();
    }
    document.images.SlideShow.src = preLoad[j].src;
    if (document.all) {
    document.images.SlideShow.filters.blendTrans.Play();
    }
    j = j + 1;
    if (j > (p - 1)) j = 0;
    t = setTimeout('runSlideShow()', slideShowSpeed);
    }
    // End -->
    </script>
    
    </head>
    
    <body onLoad="runSlideShow()">
    
    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td id="VU" height=240 width=431>
    <img src="1.jpg" name='SlideShow' width=431 height=240>
    </td>
    </tr>
    </table>
    
    <p><center>
    <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
    by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
    </center><p>
    
    <!-- Script Size: 2.13 KB -->
    
    </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/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles