var curElement = null;
offset = new Array('x', 'y');
offset.x = 0;
offset.y = -180;

function act_showIt(el) {
  var pos = el.getPosition();
  var divID = el.id.split('_');
  
  curElement = $('detailImage_'+divID[1]+'_'+divID[2]); 

  if(curElement) {
    $('detailImage_'+divID[1]+'_'+divID[2]).setStyles({
          'visibility': 'visible',
          'left': pos.x + offset['x'],
          'top': pos.y + offset['y']
    });
  } 
}

function act_HideIt() {
  if(curElement) {  
    curElement.setStyles({'visibility': 'hidden'});
  }  
  curElement = null;
}

function locate (event){
  if(curElement) {
    var win = {'x': window.getWidth(), 'y': window.getHeight()};
    var scroll = {'x': window.getScrollLeft(), 'y': window.getScrollTop()};
    var prevImg = {'x': curElement.offsetWidth, 'y': curElement.offsetHeight};
    var prop = {'x': 'left', 'y': 'top'};
    for (var z in prop){
      var pos = event.page[z] + offset[z];
      if ((pos + prevImg[z] - scroll[z]) > win[z]) pos = event.page[z] - offset[z] - prevImg[z];
      curElement.setStyle(prop[z], pos);
    };
  }
}

window.addEvent('domready', function(){
  var obj = document.getElements('div[class=imageboxfloat]');

  obj.each(function(element) {
    element.addEvents({
        'mouseenter': function(){act_showIt(this);},
        'mousemove': locate.bindWithEvent(this),
        'mouseleave': function(){act_HideIt()}
    });
  });
});