473,378 Members | 1,621 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,378 software developers and data experts.

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 = picDescPairArray.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 <= (picDescPairArray.length-1); i++){
document.getElementById(picDescPairArray[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 <= (picDescPairArray.length-1); j++){
if (j >= 1){document.getElementById(picDescPairArray[j-1]).style.zIndex =
3;}//the previous item goes down the stack

//a test line without the timer code - seems to work?
//document.getElementById(picDescPairArray[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.getElementById(picDescPair Array[j]).style.zIndex
= 5;",delayed);
// I tried - setTimeout('expr',delayed) ...without the clearInterval(a),
obviously ;o)
}
}
clearInterval(a);
Jul 20 '05 #1
1 2794
On Mon, 23 Feb 2004 01:21:35 -0000, Noh Way <No*****@Jose.com> wrote:
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.


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 = picDescPairArray.length;
var timerID = null;

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

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

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

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

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

Hope that helps,
Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 20 '05 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Robert Mark Bram | last post by:
Howdy All! I would like to find since when did different versions of browsers and/or JavaScript/JScript/ECMAScript support the SetTimeout and SetInterval methods.. this is for compatibility...
1
by: Weston C | last post by:
In the course of trying to build a simple clock, I've run into a problem using the setInterval (and setTimeout) function. http://weston.canncentral.org/misc/tkeep/tkeep.html...
1
by: John | last post by:
Michael Winter <M.Winter@blueyonder.co.invalid> wrote in message news:<opr3wd8yvj5vklcq@news-text.blueyonder.co.uk>... > On 24 Feb 2004 14:13:47 -0800, John <johnmark@fastermail.com> wrote: > > >...
5
by: oliver | last post by:
Hi, the structure of my source code is like this: <script> C = function(){ //some initialization } C.prototype.start = function{ //some action
18
by: Frances Del Rio | last post by:
this code is supposed to flip imgs at intervals of one second, but it flipps them much faster, it seems it flips them all in that first second, the more seconds the faster it flips them, instead of...
4
by: E | last post by:
I am having trouble with setTimeout working on a second call to the setTimeout function from a second page which is an html page. Here is the scenario. I have a web page and onload it calls a...
1
by: Joris Lambrecht | last post by:
Hi people, Please take a look at the issue i talk about below. (yes i do realise such functions are publicaly available) The page i'm using uses JSON defined array of image files with...
15
by: nikki_herring | last post by:
I am using setTimeout( ) to continuously call a function that randomly rotates/displays 2 images on a page. The part I need help with is the second image should rotate 3 seconds after the first...
2
by: tequilamala | last post by:
I wanna put some images on my page that change everyfew seconds or so. The problem is that when the "slideshow" begins the veryfirst image is a blank and then it goes into the show. How do I get...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.