var className = 'button';
var ext       = '.gif'; 
var over      = '_hi'; 
var stay      = '_hi'; 
var down      = '_hi';


(
function()
{
    var _click_       = null;


    function start_mouse_over()
    {
         var d = self.document;
         if(!d.images) return;
         for(var i = 0; i < d.images.length; i++)
         {
              var img = d.images[i];


              if( img.className && img.className.indexOf(className) > -1)
              addEventsToImage(img);
         }
    }


    function addEventsToImage(img)
    {
         var folder = img.src.substring(0, img.src.lastIndexOf('/') + 1) ;
         var name   = img.src.substring(img.src.lastIndexOf('/') + 1, img.src.lastIndexOf('.') ) ;
         img.name = name;


         img.onmouseover = on_mouse_over;
         img.onmouseout  = on_mouse_out;
         img.onmousedown = on_mouse_down;
         img.onclick     = on_click;



         
		 img.stay = new Image();
         img.stay.img = img;
		 img.stay.onerror = function() { this.img.onclick = null;}
		 img.stay.src = folder + img.name + stay + ext;

         img.over = new Image();
         img.over.img = img;
         img.over.onerror = function() { this.img.onmouseover = null;}
         img.over.src = folder + img.name + over + ext;

         img.down = new Image();
         img.down.img = img;
         img.down.onerror = function() { this.img.onmousedown = null;}
         img.down.src = folder + img.name + down + ext;



         img.out = img.src;

         ///////////////////////////////////////////////////////
         // wurde breits vorher auf das Bild geklickt?
         if(top.name == img.name) img.onclick();
    }


    function on_mouse_down()
    {
         if(_click_ == this) return false; 
         this.src = this.down.src;
         return true;
    }


    function on_mouse_over()
    {
         if(_click_ == this) return false; // ist bereits angeklickt.
         this.src = this.over.src;
         return true;
    }


    function on_mouse_out()
    {
         if(_click_ == this) return false;

         this.src = this.out;
         return true;
    }


    function on_click()
    {
         if(_click_ == this) return false;
         this.src = this.stay.src;



         if(_click_) _click_.src = _click_.out;
         _click_ = this;
         top.name = this.name;
         return true;
    }



    function on_resize()
    {
        if(_click_) _click_.src = _click_.stay.src;
    }




    if(window.addEventListener)
    {
         window.addEventListener('load', start_mouse_over, false);
         window.addEventListener('resize', on_resize, false);
    }
    else
    {
         window.onload   = start_mouse_over;
         window.onresize = on_resize
    }
}()
)
