SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Set Timeout Interval

    Hi All:

    I've pieced together code to randomly display an array of images and links.
    I now want the array to change every 5 seconds, so I added the set timeout, but it doesn't work. Any suggestions is greatly appreciated.

    function disp_links(number) {
    for (i=1;i<=number;i++) {
    var k = Math.floor(Math.random()*links.length);
    document.write(links[k]);
    setTimeout("disp_links(number)",5000);
    }
    }
    function disp_links2(number) {...
    function disp_links3(number) {...

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,789
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    setTimeout("disp_links("+number+")",5000);
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Or,
    Code JavaScript:
    setTimeout(function () {
        disp_links(number);
    }, 5000);
    Birnam wood is come to Dunsinane

  4. #4
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,789
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    Or,
    Code JavaScript:
    setTimeout(function () {
        disp_links(number);
    }, 5000);
    Does that still work if the value stored in number changes between the call to setTimeout and the call to disp_links?
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To be on the safe side you could do it like this,
    Code JavaScript:
    setTimeout((function (n) {
        return function () {
            disp_links(n);
        };
    })(number), 5000);
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank You both for help!
    The code suggested did what I asked, after the specified time the image and links changed, but now for the embarrassing part.

    After the specified time the image changed and the rest of the website went away and I was left with just the new image. Another interesting thing is that interval did not work a second time.

    So I'm thinking that I'm placing it in the wrong location, instead of up in the calculation code, maybe down in the display code, but that didn't work either...
    disp_links(1);

  7. #7
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by JimEShoe View Post
    After the specified time the image changed and the rest of the website went away and I was left with just the new image. Another interesting thing is that interval did not work a second time.
    Yes, because you use document.write() which will replace the current page.

    You'll need to use DOM methods to manipulate the current page without replacing it.
    Birnam wood is come to Dunsinane

  8. #8
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks AC!

    I'll start looking into it.

  9. #9
    SitePoint Member
    Join Date
    Jun 2010
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi All:
    Thanks for previous help with this this, using your suggestions I was able to get this working the way I wanted. Here's the code and see the Big BUT at the bottom:

    see below:
    Code:
     if (document.images) {
    ads2 = new Array(7);
    ads2[0] = "http://...custom6.jpg";
    ads2[1] = "http://...custom0.jpg";
    ads2[2] = "http://...custom1.jpg";
    ads2[3] = "http://...custom2.jpg";
    ads2[4] = "http://...custom3.jpg";
    ads2[5] = "http://...custom4.jpg";
    ads2[6] = "http://...custom5.jpg";
    }
    
    newplace2 = new Array(7);
    newplace2[0] = "http://..."
    newplace2[1] = "http://..."
    newplace2[2] = "http://..."
    newplace2[3] = "http://..."
    newplace2[4] = "http://..."
    newplace2[5] = "http://..."
    newplace2[6] = "http://..."
    
    var timer2 = null
    var	 counter2 = 0
    
    function banner2() {
    	    timer2=setTimeout("banner2()", 10000);
    		counter2++;
    		if (counter2 >= 7)
    		counter2 = 0;
    		document.bannerad2.src = ads2[counter2];
    }
    
    function gothere2() {
    		counterc = counter2;
    		window.location.href = newplace2[counterc];
    }
    As you can see after every 10 sec the images and links rotate through the 7 options.

    BUT:
    I now want to create menu / selection type hot spots (using Map corrdes on the images)
    Code:
    <map name="Map1"><area shape="rect" coords="25,38,321,254" href="#"></map>, <map name="Map2"><area shape="rect" coords="35,48,321,254" href="#"></map> ETC.
    Is there a way to change href in the code directly above to set the counter to display a specific image, then resume the JS timer function?


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
  •