How to Rotate/Slideshow Text DIVs on page?

[oooo]

I am trying to modify the script below to slideshow/rotate through a handful of text DIVs.

I need these DIVs to appear in order-- div 1, then div 2, then div 3. Each would appear for 5 seconds, then show the next div... but in order.

The script below works well for Random divs, but I need them to be in order-- div 1, div 2, div 3... each time.

<div id="d1" style="display:none;">some text 1</div>
<div id="d2" style="display:none;">some text 2</div>
<div id="d3" style="display:none;">some text 3</div>

<script type="text/javascript">
divs = ['d1','d2','d3'];

function hideDivs() {
for (var i=0; i<divs.length; i++)
document.getElementById(divs[i]).style.display = 'none';
}

function showDiv() {
hideDivs(); //hide them all before we show the next one.
var randomDiv = divs[Math.floor(Math.random()*divs.length)];
var div = document.getElementById(randomDiv).style.display =
'block';

setTimeout(showDiv,500); //set a delay before showing the next div
}

showDiv();
</script>

[Rabbit]

Please use code tags when posting code.

All you need to do is get rid of the random part and use a variable to track which sequential div to use next.

[oooo]

Thanks. How would I go about doing that? Nothing I've tried has worked, and I can't find anything that's a 'how to' about this online.

[Rabbit]

Please post one of the things you've tried so I can see where you went wrong.

[oooo]

Here's the most recent thing I tried.

<script type="text/javascript">
divs = ['d1','d2','d3'];

function hideDivs() {
for (var i=0; i<divs.length; i++)
document.getElementById(divs[i]).style.display = 'none';
}


function showDiv() {
hideDivs(); //hide them all before we show the next one.
var Div1 = document.getElementById(d1).style.display =
'block';
var Div2 = document.getElementById(d2).style.display =
'block';
var Div3 = document.getElementById(d3).style.display =
'block';

setTimeout(showDiv,5000); //set a delay before showing the next div
}

showDiv();

[Rabbit]

For one thing, you hide them all, and then right away you display them all. You also need a variable to keep track of where you are in the sequence so you know which one to display.

[oooo]

I'm beyond lost.

Did I at least display a specific div right in this code?

[Rabbit]

If you're this lost, it would benefit you to work through a javascript tutorial before trying to write javascript. I recommend the one on w3schools.

You didn't display one correctly. You need to put the name of the div in quotes.

[oooo]

I'm just trying to edit an existing open source script, not write one. I've read tutorials and books, but I don't understand how to edit this script to do what we need it to.

I'll try adding quotes to this

var Div3 = document.getElementById('d3').style.display =
'block';

[Rabbit]

Please use code tags when posting code.

All that will do is make d3 visible. You still need to create a variable to track the next div you need to make visible.

You should be aware that editing a javascript necessitates that you write javascript. Therefore, learning and knowing the basics of javascript will greatly help your attempts in editing javascript.

[oooo]

Ah. I guess I should change my question to be:

"are there any open source scripts already out there that do what I am looking for here?"