Results 1 to 5 of 5

Thread: Random Starting Point in Slideshow?

  1. #1
    Join Date
    Nov 2005

    Random Starting Point in Slideshow?

    Hi, everyone--
    On my website (riveroftimephotography.com) I'm using a script that I found here:


    The script works great and I like it a lot. It displays the images in order from 0 to 15.
    How can I have a random starting point each time? Instead of always starting at zero, I want it to start somewhere in the middle. The order of slides can stay the same.
    I would appreciate any help you can give me.
    Many thanks,

  2. #2
    Join Date
    Nov 2006
    It appear the initial value of the variable j determines which slide is displayed first:
    var j=0;
    You could move that line below var p = Pic.length in order to use the variable p to generate a random number:

    var p = Pic.length
    var j = Math.round((p-1)*Math.random());

    The starting point will then be random. That mean it might start at 0, somewhere in the middle or towards the last slide.

  3. #3
    Join Date
    Nov 2005
    Holyhttp, that works perfectly. Thank you so much for answering my question! --Ed

  4. #4
    Join Date
    Sep 2012
    I want to do something exactly what morykwas is doing, but instead of starting the slideshow w/ same image every time, i want to start at random point. How can I achieve that?

    For example, in morykwas's case, s/he is starting the slideshow with the welcome image (<img src="home-welcome.jpg" name='SlideShow' width="1072" height="712">) every time and then randomly picking next images from the Pic[]

    on the other hand, I want to start the random slideshow directly from the Pic[]. can some one plz help me with this? Thank you!

  5. #5
    Join Date
    Nov 2006
    It's just a matter of choosing a random image from your set than assigning its URL to the "src" attribute of your image tag.
    Suppose your image tag is:
    <img src="" id="slideshow" width="400" height="300">

    var pictures,folder,timer;

    function initSlideshow(){
    folder='URL of images folder';
    pictures=['image1.jpg', 'image2.jpg',...]; // ... for other images
    var p=pictures.length;
    var j=Math.random()*(p-1);
    var slideshow=document.getElementById("slideshow");

    function swapImage(j){
    if(j>=pictures.length) j=0;

    var imgurl=folder+pictures[j];
    slideshow.setAttribute("src", imgurl);]

    setTimeout(function(){swapImage(j);}, 5000); //swap slide every 5000 ms or so

Thread Information

Users Browsing this Thread

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

Tags for this Thread

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