refreshing div content?

Hello, I have a script which randomly cycles through a set of divs at a set interval, so say every 10 seconds the current div is replaced by another in the list. These divs are shown/hidden using the display property. Now some of these divs will include a Flash audio player, and each of these players will play a different piece of audio. Each is set to autoplay, and then will stop playing when the audio comes to an end.

The problem is, I need the audio players to autoplay (starting at the beginning position 0:00) each time its div is displayed. They do autoplay as soon as the player's div is displayed for the first time. But when the div is displayed for the second time, the player is still stopped from the last time, and does not autoplay from the start again. I was playing around with the jQuery .remove for awhile which seems like it would work, if there was a way to bring back that removed div, but apparently this can't be done (correct me if I'm wrong here).

So, now I'm trying to see if I could somehow refresh each of these divs each time they go hidden, so that when they are displayed again, the audio player autoplays like it did the first time around.

Here is the random div displayer. Any ideas?


NumberOfDivsToRandomDisplay = 3;
var CookieName = 'DivRamdomValueCookie';
function DisplayRandomDiv() {
var r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay);
if(NumberOfDivsToRandomDisplay > 1) {
var ck = 0;
var cookiebegin = document.cookie.indexOf(CookieName + "=");
if(cookiebegin > -1) {
cookiebegin += 1 + CookieName.length;
cookieend = document.cookie.indexOf(";",cookiebegin);
if(cookieend < cookiebegin) { cookieend = document.cookie.length; }
ck = parseInt(document.cookie.substring(cookiebegin,cookieend));
}
while(r == ck) { r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay); }
//document.cookie = CookieName + "=" + r;
}
for( var i=1; i<=NumberOfDivsToRandomDisplay; i++) {
document.getElementById("randomDiv"+i).style.display="none";
}
document.getElementById("randomDiv"+r).style.display="inline";
}
DisplayRandomDiv()
setInterval('DisplayRandomDiv()', 10000)

Hello, I have a script which randomly cycles through a set of divs at a set interval, so say every 10 seconds the current div is replaced by another in the list. These divs are shown/hidden using the display property. Now some of these divs will include a Flash audio player, and each of these players will play a different piece of audio. Each is set to autoplay, and then will stop playing when the audio comes to an end.

The problem is, I need the audio players to autoplay (starting at the beginning position 0:00) each time its div is displayed. They do autoplay as soon as the player's div is displayed for the first time. But when the div is displayed for the second time, the player is still stopped from the last time, and does not autoplay from the start again. I was playing around with the jQuery .remove for awhile which seems like it would work, if there was a way to bring back that removed div, but apparently this can't be done (correct me if I'm wrong here).

So, now I'm trying to see if I could somehow refresh each of these divs each time they go hidden, so that when they are displayed again, the audio player autoplays like it did the first time around.

Here is the random div displayer. Any ideas?


NumberOfDivsToRandomDisplay = 3;
var CookieName = 'DivRamdomValueCookie';
function DisplayRandomDiv() {
var r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay);
if(NumberOfDivsToRandomDisplay > 1) {
var ck = 0;
var cookiebegin = document.cookie.indexOf(CookieName + "=");
if(cookiebegin > -1) {
cookiebegin += 1 + CookieName.length;
cookieend = document.cookie.indexOf(";",cookiebegin);
if(cookieend < cookiebegin) { cookieend = document.cookie.length; }
ck = parseInt(document.cookie.substring(cookiebegin,cookieend));
}
while(r == ck) { r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay); }
//document.cookie = CookieName + "=" + r;
}
for( var i=1; i<=NumberOfDivsToRandomDisplay; i++) {
document.getElementById("randomDiv"+i).style.display="none";
}
document.getElementById("randomDiv"+r).style.display="inline";
}
DisplayRandomDiv()
setInterval('DisplayRandomDiv()', 10000)


How about, you have an array that will store the contents of the DIV you are wanting to hide in your loop counter. Then empty the div by making it's html content empty. Then when it comes back round, you put the html back in from the array.

So for example,


var divs = new Array();

for( var i=1; i<=NumberOfDivsToRandomDisplay; i++) {

divs[i] = document.getElementById("randomDiv"+i).innerHTML;
document.getElementById("randomDiv"+i).innerHTML = '';

}


This should store the current html inside the div, and then delete it.

This isn't working for me. I placed the code you posted directly under the Random Div Displayer script. Now it empties the divs, but no content ever shows up again in those divs after being emptied. All of the script is placed at the end of the Body. Is there any additional code I need to add besides what you posted there?