Multiple setTimeout in function?

Discussion in 'Javascript' started by Max, Oct 10, 2006.

  1. Max

    Max Guest

    Hi,

    I'm not exactly sure why this doesn't work. I'm basically just trying a
    simple approach at a slide down div.

    function slide_div {


    setTimeout("document.getElementById('mydiv').style.length='10px';",1000);

    setTimeout("document.getElementById('mydiv').style.length='20px';",1000);

    setTimeout("document.getElementById('mydiv').style.length='30px';",1000);

    setTimeout("document.getElementById('mydiv').style.length='40px';",1000);

    setTimeout("document.getElementById('mydiv').style.length='50px';",1000);

    setTimeout("document.getElementById('mydiv').style.length='60px';",1000);

    }

    It seems like it just runs the last setTimeout line and pops out all at
    once. I've even tried adding a=, b=, c=,. etc at the begining of each
    line to no avail.

    Anybody know a simple solution for this?

    Thanks,
    Max
    Max, Oct 10, 2006
    #1
    1. Advertising

  2. Max

    Guest

    Max wrote:
    > Hi,
    >
    > I'm not exactly sure why this doesn't work. I'm basically just trying a
    > simple approach at a slide down div.
    >
    > function slide_div {
    >
    >
    > setTimeout("document.getElementById('mydiv').style.length='10px';",1000);
    >
    > setTimeout("document.getElementById('mydiv').style.length='20px';",1000);
    >
    > setTimeout("document.getElementById('mydiv').style.length='30px';",1000);
    >
    > setTimeout("document.getElementById('mydiv').style.length='40px';",1000);
    >
    > setTimeout("document.getElementById('mydiv').style.length='50px';",1000);
    >
    > setTimeout("document.getElementById('mydiv').style.length='60px';",1000);
    >
    > }
    >
    > It seems like it just runs the last setTimeout line and pops out all at
    > once. I've even tried adding a=, b=, c=,. etc at the begining of each
    > line to no avail.
    >
    > Anybody know a simple solution for this?
    >
    > Thanks,
    > Max


    Increment your milliseconds instead of using 1000 for all of them. e.g.
    1000,2000,etc
    , Oct 10, 2006
    #2
    1. Advertising

  3. Max

    Evertjan. Guest

    Max wrote on 10 okt 2006 in comp.lang.javascript:
    > I'm not exactly sure why this doesn't work. I'm basically just trying a
    > simple approach at a slide down div.
    >
    > function slide_div {


    a function needs ()

    > setTimeout("document.getElementById

    ('mydiv').style.length='10px';",1000);
    >
    > setTimeout("document.getElementById

    ('mydiv').style.length='20px';",1000);
    >
    > setTimeout("document.getElementById

    ('mydiv').style.length='30px';",1000);
    >
    > setTimeout("document.getElementById

    ('mydiv').style.length='40px';",1000);
    >
    > setTimeout("document.getElementById

    ('mydiv').style.length='50px';",1000);
    >
    > setTimeout("document.getElementById

    ('mydiv').style.length='60px';",1000);
    >
    >}
    >
    > It seems like it just runs the last setTimeout line and pops out all at
    > once. I've even tried adding a=, b=, c=,. etc at the begining of each
    > line to no avail.



    They start all at [nearly] the same time,
    so they all fire at [nearly] the same second later.
    setTimeout() is NOT a wait() function.

    Try:

    ==================================
    var mydiv = document.getElementById('mydiv');
    var myLength = 0;
    slide_div();

    function slide_div() {
    mydiv.style.length= myLength + 'px';
    myLength += 10;
    if (myLength<=60)
    setTimeout("slide_div()",1000);
    };
    ===================================

    not tested.

    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
    Evertjan., Oct 10, 2006
    #3
  4. Max

    Max Guest

    On Oct 10, 11:03 am, "Evertjan." <> wrote:
    > Max wrote on 10 okt 2006 in comp.lang.javascript:
    >
    > > I'm not exactly sure why this doesn't work. I'm basically just trying a
    > > simple approach at a slide down div.

    >
    > > function slide_div {a function needs ()

    >
    > > setTimeout("document.getElementById('mydiv').style.length='10px';",1000);

    >
    > > setTimeout("document.getElementById('mydiv').style.length='20px';",1000);

    >
    > > setTimeout("document.getElementById('mydiv').style.length='30px';",1000);

    >
    > > setTimeout("document.getElementById('mydiv').style.length='40px';",1000);

    >
    > > setTimeout("document.getElementById('mydiv').style.length='50px';",1000);

    >
    > > setTimeout("document.getElementById('mydiv').style.length='60px';",1000);

    >
    >
    >
    > >}

    >
    > > It seems like it just runs the last setTimeout line and pops out all at
    > > once. I've even tried adding a=, b=, c=,. etc at the begining of each
    > > line to no avail.They start all at [nearly] the same time,

    > so they all fire at [nearly] the same second later.
    > setTimeout() is NOT a wait() function.
    >
    > Try:
    >
    > ==================================
    > var mydiv = document.getElementById('mydiv');
    > var myLength = 0;
    > slide_div();
    >
    > function slide_div() {
    > mydiv.style.length= myLength + 'px';
    > myLength += 10;
    > if (myLength<=60)
    > setTimeout("slide_div()",1000);};===================================
    >
    > not tested.


    Thanks for the suggestions. This worked fine and I now understand what
    I was doing wrong.

    Max
    Max, Oct 10, 2006
    #4
  5. Max

    Robin Guest

    Max wrote:
    > document.getElementById('mydiv').style.length='10px'


    Err, what's 'length'? I don't see this property at:
    http://www.w3schools.com/css/css_reference.asp

    Shouldn't it be 'width' or 'height', or am I missing something?

    Robin
    Robin, Oct 11, 2006
    #5
  6. JRS: In article <>,
    dated Tue, 10 Oct 2006 08:47:52 remote, seen in
    news:comp.lang.javascript, Max <> posted :
    >
    >Anybody know a simple solution for this?


    FAQ 4.20.

    It's a good idea to read the newsgroup and its FAQ. See below.
    --
    © John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4 ©
    <URL:http://www.jibbering.com/faq/>? JL/RC: FAQ of news:comp.lang.javascript
    <URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
    <URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
    Dr John Stockton, Oct 11, 2006
    #6
  7. JRS: In article <egibhj$4bf$>, dated Wed, 11 Oct
    2006 09:55:15 remote, seen in news:comp.lang.javascript, Robin
    <> posted :
    >Max wrote:
    >> document.getElementById('mydiv').style.length='10px'

    >
    >Err, what's 'length'? I don't see this property at:
    >http://www.w3schools.com/css/css_reference.asp


    Not the most reliable of sites, IIRC, but it should be OK here.

    >Shouldn't it be 'width' or 'height', or am I missing something?


    I'd suggest 'fontSize'. But specifying absolute font-sizes is generally
    deprecated.

    --
    © John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4 ©
    <URL:http://www.jibbering.com/faq/>? JL/RC: FAQ of news:comp.lang.javascript
    <URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
    <URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
    Dr John Stockton, Oct 11, 2006
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    3
    Views:
    4,719
    Diez B. Roggisch
    Jun 12, 2006
  2. qasim

    how to use setTimeout function

    qasim, Feb 25, 2009, in forum: ASP .Net
    Replies:
    2
    Views:
    289
    George
    Feb 25, 2009
  3. Test
    Replies:
    0
    Views:
    81
  4. Ken
    Replies:
    4
    Views:
    112
    Michael Winter
    Oct 7, 2004
  5. JellyON
    Replies:
    2
    Views:
    82
    JellyON
    Jul 15, 2005
Loading...

Share This Page