jquery - trigger - on mouse over on mouse out

Cómo: Agregar/Eliminar clase en mouseOver/mouseOut-JQuery.hover?

Question

Buscando cambiar el color del borde en una caja ..

..cuando el usuario mueve hacia arriba / hacia fuera ..

Aquí está el intento de código ... Necesita trabajo!

JQuery:

<script>
$("result").hover(
function () {
$(this).addClass("result_hover");
},
function () {
$(this).removeClass("result_hover");
}
);
</script>

CSS3:

<style>
.result {
height: 72px;
width: 100%;
border: 1px solid #000;
}
.result_hover {
border: 1px solid #fff;
}
</style>

HTML5:

<div class="result">
<div class="item">
<div id="item1">
<i class="icon"></i>&nbsp;##
</div>
</div>
<div>

Gracias por mirar

Answer 1

A su selector le falta un . y aunque dices que quieres cambiar el border-color del border-color , estás agregando y eliminando una clase que establece el background-color

Answer 2

Le falta el punto en el selector y puede usar el método toggleClass en jquery:

$(".result").hover(
function () {
$(this).toggleClass("result_hover")
}
);

Answer 3

Puede usar: {call and out call call}

$(".result").hover(function () {
$(this).toggleClass("result_hover");
});

Para su ejemplo, mejor será usar pseudo clase CSS :hover : {no js / jquery needed}

.result {
height: 72px;
width: 100%;
border: 1px solid #000;
}
.result:hover {
background-color: #000;
}

Answer 4

Se olvidó el dot del selector de clase de la clase de resultado.

Demo en vivo

$(".result").hover(
function () {
$(this).addClass("result_hover");
},
function () {
$(this).removeClass("result_hover");
}
);

Puedes usar toggleClass en el evento hover

Demo en vivo

 $(".result").hover(function () {
$(this).toggleClass("result_hover");
});