Click to See Complete Forum and Search --> : Switch DIVs automatic...


weee
06-04-2005, 12:22 PM
Thanks to vwphillips, Jona, Natdrip & felgall now I have this code here the allow me to nevigate between the DIV's.

What I'm trying to figure out is how can I make the DIV's to switch every X second on their own.

What do I need to use?

That's the code:


<html>
<head>
<style>
.tbody {display: none;}
</style>
<script Language="JavaScript">
var current = 1;

function move( byWhat )
{
current += byWhat;
if ( current < 1 ) current = 5;
if ( current > 5 ) current = 1;
show( current );
}

function show( nwhich )
{
current = nwhich;
for ( var dnum = 1; dnum <= 5; ++dnum )
{
var dv = document.getElementById("BODY"+dnum);
dv.style.display = ( dnum == nwhich ? 'block' : 'none' );
}
}
</script>
</head>

<body>

<DIV ID="BODY1" class="tbody" style="display: block;">
<b>DIV 1</b><br>
</DIV>
<DIV ID="BODY2" class="tbody">
<b>DIV 2</b><br>
</DIV>
<DIV ID="BODY3" class="tbody">
<b>DIV 3</b><br>
</DIV>
<DIV ID="BODY4" class="tbody">
<b>DIV 4</b><br>
</DIV>
<DIV ID="BODY5" class="tbody">
<b>DIV 5</b><br>
</DIV>

<a href="#" onClick="move(-1);">&laquo; Previous</a>
&nbsp;&nbsp;&nbsp;&nbsp;
<a href="#" onClick="move(1);">Next &raquo;</a>

</body>
</html>


Thanks

phpnovice
06-04-2005, 01:06 PM
window.setTimeout('move(1)', 15000); // every 15 seconds

weee
06-05-2005, 04:01 PM
Where do I need to use it?

phpnovice
06-05-2005, 04:10 PM
Use it where you need it. ;)
Where is that?

weee
06-05-2005, 04:13 PM
I believe inside the function... the thing is that I don't know how to switch the DIV's.

phpnovice
06-05-2005, 04:44 PM
the thing is that I don't know how to switch the DIV's.
Huh? :confused: Your link takes care of that:

<a href="#" onClick="move(1);">Next &raquo;</a>

weee
06-05-2005, 05:25 PM
I mean... in an automated way

phpnovice
06-05-2005, 07:33 PM
OK, one example -- using the code previously given:

<body onload="window.setTimeout('move(1)', 15000); return true;">

weee
06-05-2005, 10:31 PM
Mmm... I see your point but only the first DIV changes.
How can I continute change'em?

phpnovice
06-06-2005, 06:59 AM
One way:

<body onload="window.setInterval('move(1)', 15000); return true;">

weee
06-06-2005, 11:12 AM
Oh nice... simple.

What's the difference between the setInterval & setTimeout?

Thanks a lot!

phpnovice
06-06-2005, 03:46 PM
setInterval re-executes itself automatically.
setTimeout executes one time and quits.

weee
06-06-2005, 06:07 PM
Thanks!

phpnovice
06-06-2005, 06:16 PM
Cheers.