XodoX: Javascript-Problem / Elegante Lösung?

Beitrag lesen

Hallo,

habe ein kleines "Ansatz"-Problem in meinem Script:

<script type="text/javascript">  
 function rand(min,max)  
 {  
 var wert =  min + Math.ceil(Math.random() * 1000) % (max-min) + 1;  
 return wert;  
 }  
  
var last_request=0;  
var aktiv = setInterval("loadData()",rand(10,20)*1000);  
setTimeout('loadData();',rand(5,35)*100);  
  
function asb_loadingEnd()  
{  
 document.getElementById("asb_loading").innerHTML='normal';  
}  
  
function loadData()  
{  
 document.getElementById("asb_loading").innerHTML='<img src=\"loading.gif\">';  
 setTimeout('asb_loadingEnd();',rand(5,35)*100);  
}  
</script>  
  
  
</head>  
  
<body>  
    <span id="asb_loading"/>normal</span>  
</body>

Dieses Script ersetzt den Text "normal" im span-element(id="asb_loading") alle paar Sekunden (Zufallsgeneriert) mit einer Grafik (loading.gif)

Bis hierher habe ich keine Probleme. Jetzt aber mein Anliegen:
Ich habe mehrere span-elemente, welche allesamt mit der loading.gif ersetzt werden sollen, allesamt nach einer zufallsgenerierten Sekundenanzahl, immer unterschiedlich.
Also beispielsweise wird nach 12 Sekunden der 1. Span-Eintrag für 2,5 Sekunden mit der loading.gif ersetzt, nach 18 Sekunden der 2. Span-Eintrag für 1,8 Sekunden, nach weiteren 15 Sekunden der nächste Span-Eintrag für 0,5 Sekunden und so weiter. Sollte sich auch alles überschneiden dürfen können!

Wie erreiche ich das am elegantesten? Ich hab da einfach ein Denkproblem, wie ich das in ein array, geschickte Funktionsverschachtelung oder ähnliches packen soll.

Wäre um einen Rat sehr dankbar!