Remove Jquery .css on unhover

Question

How to remove .css("background","red"); from (A.yuimenubaritemlabel.sub) element after unhovering .yuimenuitemlabel element ?

$(document).ready(function(){
  $(".yuimenuitemlabel").mouseover(function(){
   $("A.yuimenubaritemlabel.sub").css("background","red");
  });
});

Adil · Accepted Answer · 2013-01-05 13:33:49Z

6

You need to reset the css property on mouse leave.

$(".yuimenuitemlabel").mouseover(function(){
   $("A.yuimenubaritemlabel.sub").css("background","red");
}).mouseleave(function(){
     $("A.yuimenubaritemlabel.sub").css("background","");
});

Use hover function if you have do do many things you can use hover.

$(".yuimenuitemlabel").hover(function(){
   $("A.yuimenubaritemlabel.sub").css("background","red");
}, function(){
     $("A.yuimenubaritemlabel.sub").css("background","");
});

Use hover function assuming you just need to change the css. You can make two class one is sub and other is newsub.

$(".yuimenuitemlabel").hover(function(){
     $("A.yuimenubaritemlabel.sub").toggleClass("newsub");
});

edited Jan 5, 2013 at 13:33

answered Jan 5, 2013 at 13:22

Adil

148k25 gold badges217 silver badges207 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Adil Over a year ago

Show us html or make a fiddle on jsfiddle.com

Gabriele Petrioli · Accepted Answer · 2013-01-05 13:27:19Z

3

It is a better practice to add/remove a class

$(document).ready(function(){
    $(".yuimenuitemlabel").hover(function(){
        $("a.yuimenubaritemlabel.sub").toggleClass('hoverclass');
    });
});

And use a class with

.hoverclass{
   background-color:red;
}

answered Jan 5, 2013 at 13:27

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

Collectives™ on Stack Overflow

Remove Jquery .css on unhover

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related