setTimeout() & setInterval() for DOM slideshow

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Noh Way

    setTimeout() & setInterval() for DOM slideshow

    I have a stack of DOM elements and I have stored their IDs in an array. I
    want to press a button - this code is from that button's event's function-
    and have a slideshow as each element is brought to the top, in turn. All
    this, with a user definable delay (currently fixed in the code at 5 secs). I
    cannot get the loop to stop while the interval timer is counting the time.

    Help please :o?

    Greg

    ===code below====

    var delayed = 5000;
    var numberOfSteps = picDescPairArra y.length; //this array contains element
    IDs for items in a z-order stack
    //if there is more than one item in the array, make the z-index 3 for all
    of them
    if (numberOfSteps > 1){
    //change the z-index of all the items to 3
    for (i=0; i <= (picDescPairArr ay.length-1); i++){
    document.getEle mentById(picDes cPairArray[i]).style.zIndex = 3;
    }

    //change the z-index of each item to 5 in turn,
    //(changing the previous item's z-index back to 3, providing it isn't the
    first one)
    for (j=0; j <= (picDescPairArr ay.length-1); j++){
    if (j >= 1){document.get ElementById(pic DescPairArray[j-1]).style.zIndex =
    3;}//the previous item goes down the stack

    //a test line without the timer code - seems to work?
    //document.getEle mentById(picDes cPairArray[j]).style.zIndex = 5;
    alert('next?');

    //the next item comes up to the top after a delay of 5 secs - well, it
    should???
    a=setInterval(" document.getEle mentById(picDes cPairArray[j]).style.zIndex
    = 5;",delayed);
    // I tried - setTimeout('exp r',delayed) ...without the clearInterval(a ),
    obviously ;o)
    }
    }
    clearInterval(a );


  • Michael Winter

    #2
    Re: setTimeout() &amp; setInterval() for DOM slideshow

    On Mon, 23 Feb 2004 01:21:35 -0000, Noh Way <Noh.Way@Jose.c om> wrote:
    [color=blue]
    > I have a stack of DOM elements and I have stored their IDs in an
    > array. I want to press a button - this code is from that button's
    > event's function - and have a slideshow as each element is brought
    > to the top, in turn. All this, with a user definable delay
    > (currently fixed in the code at 5 secs). I cannot get the loop to
    > stop while the interval timer is counting the time.[/color]

    Your code requires some restructuring, which I've attempted below.
    Unfortunately, without the containing page, I can't test it so I'll have
    to leave it to you.

    If there are any further problems, please post a URL, or a sample of the
    HTML, for this. I, and others, can then check any solutions before posting
    them.

    var delayed = 5000;
    var numberOfSteps = picDescPairArra y.length;
    var timerID = null;

    if ( numberOfSteps > 1 ) {
    var j = 0;

    setZIndex( getObjRef( picDescPairArra y[ 0 ]), 5 );
    for ( var i = 1; i < numberOfSteps; ++i ) {
    setZIndex( getObjRef( picDescPairArra y[ i ]), 3 );
    }

    timerID = setInterval( function() {
    setZIndex( getObjRef( picDescPairArra y[ j++ ]), 3 );
    setZIndex( getObjRef( picDescPairArra y[ j ]), 5 );
    if( j == numberOfSteps - 1 ) clearInterval( timerID );
    }, delayed );
    }

    function getObjRef( id ) {
    if ( document.getEle mentById ) {
    return document.getEle mentById( id );
    } else if ( document.all ) {
    return document.all[ id ];
    }
    return null;
    }

    function setZIndex( obj, index ) {
    if( obj && obj.style && 'undefined' != typeof obj.style.zInde x )
    obj.style.zInde x = index;
    }

    Hope that helps,
    Mike

    --
    Michael Winter
    M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)

    Comment

    Working...