function setEvents() {
	var chords = $$("a.chord");
    var arrayChords = $A(chords);
    arrayChords.each(function(chord){
    	
    	chord.onmouseover = showChord;
    	chord.onclick = function (){return false;};
    	chord.onmouseout = hideChord;
    } );
}

Event.observe(window, "load", setEvents, false);


function showChord(event){
	if (!event) event = window.event;
	var chord = Event.element(event);
	
	var chordDef = chord.innerHTML;
	var chordDiv = $(chordDef);
	if(chordDiv!=undefined)
	{	
    	var xSeparation = 50; // Needed in order to avoid multiple onmouseover
    	var ySeparation = -160; // Make it appear over the chord name
		chordDiv.style.left = chord.offsetLeft + xSeparation + "px";
    	chordDiv.style.top = chord.offsetTop + ySeparation + "px";
	
  	 	chordDiv.style.position = 'absolute';
   
		new Effect.Appear(chordDiv, {duration: 0.5});
	}
	return false;
}


function hideChord(event){
	if (!event) event = window.event;
    var chord = Event.element(event);
	var chordDef = chord.innerHTML;
	var chordDiv = $(chordDef);
	if(chordDiv!=undefined)
	{
		new Effect.Fade(chordDiv, {duration: 0.5});
	}
	return false;
}