function setEventListener(item,event,func,bool) {
 if(item.addEventListener){
	item.addEventListener(event,func,bool);
 } else {
	item.attachEvent('on'+event,func,bool);
 }
}

setEventListener(window,'load',init_hover_box,true);

function init_hover_box(){
 var links = document.links;
 var i = 0;
 while(links[i]){
  if(links[i].getAttribute('rel') == 'HoverBox'){
   setEventListener(links[i],'mouseover',showInfo,true);
   setEventListener(links[i],'mouseout',hideInfo,true);
   setEventListener(links[i],'mousemove',moveInfo,true);
  }
  i++;
 }
}

function showInfo(aEvent) {
 var target = getBox(aEvent);
 if(!target.hover_box){
  var hover_box = document.createElement('div');
  hover_box.className = 'content-box hover-box';
  var image = target.getElementsByTagName('img')[0];
  var new_image = image.cloneNode(true);
  new_image.removeAttribute('width');
  new_image.removeAttribute('height');
  var aSpan = document.createElement('span');
  aSpan.textContent = image.getAttribute('alt');
  hover_box.appendChild(new_image);
  hover_box.appendChild(aSpan);
  target.hover_box = document.body.appendChild(hover_box);
 }
 target.hover_box.style.display = 'block';
}

function hideInfo(aEvent) {
 var target = getBox(aEvent);
 if(target.hover_box){
  target.hover_box.style.display = 'none';
 }
}
function moveInfo(aEvent){
 var target = getBox(aEvent);
 if(target.hover_box){
   target.hover_box.style.top = (aEvent.clientY + document.documentElement.scrollTop + 15) + 'px';
   target.hover_box.style.left = (aEvent.clientX + 15) + 'px';
 }
}

function getBox(aEvent){
 if(aEvent.srcElement){
  var target = aEvent.srcElement;
 } else {
  var target = aEvent.target;
 }
 while(target.className != 'design'){
  target = target.parentNode;
 }
 return target;
}