Прибамбасные лампочки глючат. Почему?

<script>
onload = function ()
{
for (var tbl = document.getElementById ('mt'), j = 0; j < 90; j++)
for (var ro = tbl.insertRow (-1), k = 0; k < 70; k++) 
   {
   var ce = ro.insertCell (-1); with (ce.style) height = width = '6px', backgroundColor = '#000';
   ce.onmouseout = function () {this.blue = 255; AAA (this)}
   }
document.body.appendChild (tbl);
}
function AAA (q)
{
q.blue = q.blue - 5;
if (q.blue >= 0)
   {
   var t = parseInt (q.blue).toString (16); if (t.length == 1) t = '0' + t;
   q.style.backgroundColor = '#0000' + t; setTimeout (AAA, 10, q);
   }
}
</script>
 
<table id="mt" cellpadding="0" cellspacing="0"></table>

<style>
img {height: 66px; width: 66px; border: 1px solid red}
</style>
<ol>
<li><img src="bs.gif">
<li><img src="bs.gif">
<li><img src="bs.gif">
<li><img id="pic2">
</ol>
<hr><input type="button" value="в четвёртый тег <img> загрузим ТАКУЮ ЖЕ гифку, что уже имеются в первых трёх - это обновит гифки во всех трёх первых тегах" onclick="document.getElementById ('pic2').src = 'bs.gif'">
<hr><input type="button" value="в четвёртый тег <img> загрузим ДРУГУЮ гифку, первые три тега не изменятся" onclick="document.getElementById ('pic2').src = 'bs.gif?1'">