Banner de imagenes en javascript

[nikko88]

Buenas, estoy intentando hacer un banner o slider de imagenes en javascript, por el momento bastante simple, y tengo algún que otro problemilla.

<script languaje="javascript">
<!--
var i;
var j;
function inici(n)
{
   i=n;

   if (i>=7)
       i=1;
     

   document.getElementById("banner").style.backgroundImage="url('img/Banner"+i+".png')";
   document.getElementById("num"+i).style.backgroundColor="#B51424";    

   if (i==1)
       document.getElementById("num6").style.backgroundColor="white";
         
   else{
        j=i-1;
        document.getElementById("num"+j).style.backgroundColor="white";
   }
   i++;
   setTimeout('inici(i)',4000);
}   
window.onload=function(){inici(1)}
//-->
</script>

<div id="banner">
   <ul class="nums">
      <li id="num1" class="nums" onClick="inici(1);"></li>
      <li id="num2" class="nums" onClick="inici(2);"></li>
      <li id="num3" class="nums" onClick="inici(3);"></li>
      <li id="num4" class="nums" onClick="inici(4);"></li>
      <li id="num5" class="nums" onClick="inici(5);"></li>
      <li id="num6" class="nums" onClick="inici(6);"></li>
   </ul>
</div>

Las imagenes me pasan correctamente cada 4 segundos, y la lista que he pegado son unos pequeños botones que muestran que foto se está mostrando en cada momento, y al pulsar esos botones el banner se situa en esa foto y sigue corriendo normalmente cada 4 segundos "EN TEORÍA".

El problema que tengo es el siguiente: Cuando le doy click a uno de esos botones, la imagen cambia bien, pero el tiempo no se resetea, es decir si le doy a un botón a los 3 segundos de que esté la misma imagen, me cambia de imagen pero sólo dura un segundo.

He probado con cleartimeout pero no lo he conseguido, no se si tiene que ver el window.onload o si alguno sabe de otra forma de conseguir el mismo efecto sin usar el onload.

Gracias.