Search code examples
javascriptonmouseover

Temporary Onmouseover


Css "hover" selector applys a temporary style to an element, but it isn't definitive:

div:hover {
 background-color: red;
}

I can do the same thing with javascript but it is a bit complicate and impossible for several elements:

var elem = document.getElementsByTagName ("div")[0];

elem.onmouseover = function () {
 this.style.backgroundColor = "red";
}

elem.onmouseout = function () {
 this.style.backgroundColor = "transparent";
}

Is there a better way ? Something like this:

document.getElementsByTagName ("div")[0].ontemporarymouseover = function () { // LoL
 this.style.backgroundColor = "red";
}

Thanks


Solution

  • // jQuery 'Temporary mouseevents'

    $("element").bind
    ({
        mouseover:
            function ()
            {
            },
        mouseout:
            function ()
            {
            }
    });
    
    $("element").unbind('mouseover mouseout');
    

    I hope this is a good approach for what you need.