How to remove css : hover using jquery?

Question

css

#nextCh:hover{
    margin-right:6px;
}

Under some conditions I want to remove this :hover event

Something like this:

if (indexL == countL) {
    $("#nextCh").css(":hover", "remove");
}

idmean · Accepted Answer · 2014-07-26 09:14:29Z

1

Do it like this:

#nextCh.withHover:hover {
   margin-right:6px;
}

Then apply the class withHover to #nextCh.

To remove the hover effect remove the class withHover:

$("#nextCh").removeClass("withHover");

answered Jul 26, 2014 at 9:14

idmean

15k9 gold badges63 silver badges90 bronze badges

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

Comments

Niklas · Accepted Answer · 2014-07-26 09:14:47Z

1

Have the :hover apply to a class which you can remove and add as you wish:

CSS:

#nextCh.hover:hover{
    margin-right:6px;
}

Javascript:

if (indexL == countL) {
    $("#nextCh").removeClass("hover");
}

answered Jul 26, 2014 at 9:14

Niklas

1,7851 gold badge12 silver badges19 bronze badges