createNotes=function(){

            showNote=function(){
                        // gets corresponding note element id
                        var id=this.id.replace(/a/,'note');
                        note=document.getElementById(id);
                        // assigns X,Y mouse coordinates to note element
                        note.style.left=event.clientX;
                        note.style.top=event.clientY;
                        // makes note element visible
                        note.style.visibility='visible';
            }

            hideNote=function(){ 
                        // gets corresponding id for note element
                        var id=this.id.replace(/a/,'note');
                        note=document.getElementById(id);
                        // hides note element
                        note.style.visibility='hidden';
            }

            // gets all <a> elements 
            as=document.getElementsByTagName('a');
            // iterates over all <a> elements
            for(i=0;i<as.length;i++){
                        // assigns mouse event handlers to <a> elements with class name "special"
                        if(/\bspecial\b/.test(as[i].className)){
                                    // shows note element when mouse is over 
                                    as[i].onmousemove=showNote;
                                    // hides note element when mouse is out
                                    as[i].onmouseout=hideNote;
                        }
            }
}

// execute code once page is loaded
window.onload=createNotes;