Controlar dos eventos con una función Jquery

[Alexis88]

Utiliza el método .hover(), el cual utiliza los eventos mouseenter y mouseleave:

Código Javascript:

$("selector").hover(function(){
    //Mouse enter
}, function(){
    //Mouse leave
});
 

También puedes encadenar métodos:

Código Javascript:

$("selector")
        .mouseover(function(){
            //Mouse over
        })
        .mouseout(function(){
            //Mouse out
        });
 

Esto es útil cuando quieres realizar algún cambio o acción que no se limite a la estética del elemento afectado u otros, pues si quieres cambiar solo los estilos, es preferible utilizar la pseudoclase :hover de CSS:

Código CSS:

selector{
    /* Estilos */
}
 
selector:hover{
    /* Estilos que se aplicarán solo cuando el cursor del mouse esté sobre el elemento */
}
 

P. D.: Por si tienes dudas con respecto a las diferencias de los eventos mencionados, te recomiendo leer este artículo.

Un saludo