Looking to change the border color on a box..
..when the user mouses over/out..
Here's the attempted code.. Needs Work!
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> ##
</div>
</div>
<div>
Thanks for looking
You forgot the dot
of class selector of result class.
$(".result").hover(
function () {
$(this).addClass("result_hover");
},
function () {
$(this).removeClass("result_hover");
}
);
You can use toggleClass on hover event
$(".result").hover(function () {
$(this).toggleClass("result_hover");
});