Doesn't understand callback function in javascript code

I'm working from a java-script book and would like to create multiple menus using callback functions and some smart use of event handling. I have some code that looks like this:

window.onload = InitPage;

function InitPage(){

function hoverMenu(e, oTarget){
    var isChildOf = function(pNode, cNode){
        //alert("value of pNode:" + pNode + " value of cNode" + cNode);
        if(pNode === cNode){
            return true;
        }

        while (cNode && cNode !== pNode){
            cNode = cNode.parentNode;
        }

        return cNode === pNode;
    }

    //alert(e.srcElement);
    var target = e.target;

    if(!oTarget){
        oTarget = target;
    }

    var relTarg = e.fromElement;

    if(isChildOf(oTarget, relTarg) == false){
        alert("mouse enters");
    }
}

function unhoverMenu(e, oTarget){
    var isChildOf = function(pNode, cNode){
        //alert("value of pNode:" + pNode + " value of cNode" + cNode);
        if(pNode === cNode){
            return true;
        }

        while (cNode && cNode !== pNode){
            cNode = cNode.parentNode;
        }

        return cNode === pNode;
    }

    //alert(e.srcElement);
    var target = e.target;

    if(!oTarget){
        oTarget = target;
    }

    var relTarg = e.toElement;

    if(isChildOf(oTarget, relTarg) == false){
        alert("mouse leaves");
    }
}

var ul_menu = document.getElementById("ul_grabbed");
ul_menu.addEventListener("mouseover", function(e1){return function(e){hoverMenu(e, e1)}}(ul_menu),true);
ul_menu.addEventListener("mouseout", function(e1){return function(e){unhoverMenu(e, e1)}}(ul_menu),true);

      

        
        
        
      

    

I ran through the code. What is mainly happening here is an event fired when the mouse enters a UL element or its children, and also a fired event to leave that UL or its children. I'm having trouble understanding everything except the last snippet shown here:

ul_menu.addEventListener("mouseover", function(e1){return function(e){hoverMenu(e, e1)}}(ul_menu),true);
ul_menu.addEventListener("mouseout", function(e1){return function(e){unhoverMenu(e, e1)}}(ul_menu),true);

      

        
        
        
      

    

My understanding of these lines is that we are adding an event to the UL element with two functions, one of which is returned from within the first, which will fire during the event capture phase. My questions are why I need (ul_menu) at the end of these functions and with e1, and e does this mean that two different events are actually firing here? If someone could just explain these last two lines, I'd really appreciate it.