var dir = 'start';
 var speed = 0;
 var number = 0;
 var wHeight = 0;
 var wWidth = 0;
 
 function moveBall() 
 {
   var n = document.getElementById('bal');
   if(dir == 'up') 
   {
     speed = speed - 3;
     if ((n.offsetLeft + 3) < wWidth)
	 {
	   n.style.left = (n.offsetLeft + 3) + 'px';
	 }  
     n.style.top = (n.offsetTop - speed) + 'px';
     if(parseFloat(speed) <= 0)
       dir = 'down';
   }
   else if(dir == 'down') 
   {
     speed = speed + 2;
     if ((n.offsetLeft + 3) < wWidth)
	 {
	   n.style.left = (n.offsetLeft + 3) + 'px';
	 }  
     if(parseFloat(n.offsetTop + speed) > parseFloat(wHeight))
     {
       if(speed > 2)
       {
         dir = 'up';
         n.style.top = wHeight + 'px';
       }
       else
       {
         dir = 'rol';
       }
     }
     else
     {
       n.style.top = (n.offsetTop + speed) + 'px';
     }  
   }
   else if(dir == 'rol') 
   {
     number = number + 1;
     if (number < 40)
     {
       offset = 2;
     }
     else if (number < 80)
     { 
       offset = 1;
     }
     else
     {
       offset = 0;
     }
       
     if ((n.offsetLeft + offset) < wWidth)
	 {
	   n.style.left = (n.offsetLeft + offset) + 'px';
	 }  
   }
   else if(dir == 'start')
   {
     number = number + 1;
     if (number > 40)
     {
       dir = 'down';
       number = 0;
	   
       var browser = navigator.appName;
       if (browser == "Microsoft Internet Explorer") browser = "IE";

       var version = parseFloat(navigator.appVersion);
       if (navigator.appVersion.indexOf("MSIE") != -1) 
	   {
          temp = navigator.appVersion.split("MSIE");
          version = parseFloat(temp[1]);
       }

       if (browser == "IE" && version >= 6.0) browser = "IE6";
	   
  	   if (browser == "IE6") {
	     wHeight = document.documentElement.clientHeight - 51;
	     wWidth = document.documentElement.clientWidth - 51;
	   }
	   else if (browser == "IE") {
	     wHeight = document.body.clientHeight - 51;
	     wWidth = document.body.clientWidth - 51;
	   }
	   else {
	     wHeight = window.innerHeight - 51;
	     wWidth = window.innerWidth - 51;
       } 
     }   
   }
 }

 window.onload = function() 
 {
   setInterval(moveBall, 100);
 }