var aktive = false;
var org_width = false;

function myfunc_zoom_out()
{
  if(aktive || this.getStyle('width').toInt() > 110)
  {
   return;
  }
 
 if(!org_width)
  org_width = this.getStyle('width').toInt();
  
 aktive = this; 
 this.setStyle('zIndex', 5);
 this.setStyle('position', 'absolute');
 
  var myEffects = $(this).effects({duration: 0, transition:Fx.Transitions.Sine.easeInOut});

  myEffects.start({'width': [org_width, 200],'left': [0, -20]});
  //myEffects.start({'width': [165, 250]});
}

function myfunc_zoom_in()
{
  if(!aktive || aktive != this || this.getStyle('width').toInt() < 200)
    return;

  var myEffects = $(this).effects({duration: 0, transition:Fx.Transitions.Sine.easeInOut});
  myEffects.addEvent('onComplete',completeZoomIn);
  myEffects.start({'width': [200, org_width], 'left': [-20, 0]});

}

function completeZoomIn()
{

  if(!aktive)
   return;

  aktive.setStyle('zIndex', 1);
  aktive.setStyle('position', 'relative');
  aktive = false;
  org_width = false;
}

window.addEvent('domready', function(){

  $$('.prevImage').each(function(img)
  {
    img.style.position = 'relative';
    img.style.zIndex   = '1';
    img.addEvent('mousemove', myfunc_zoom_out);
    img.addEvent('mouseleave', myfunc_zoom_in);
  })

});

