JQUERY .css() with :hover pseudo-class

Question

The following code doesn't apply to the CSS classes with :hover, but does with everything else. Anyway to make it work with CSS classes that have :hover, or any pseudo-classes for the matter?

$('.nav-sidebar, .nav-sidebar:hover').css("border-color", "blue");

I do not understand this question. – Lightness Races in Orbit May 24 '14 at 06:05 — Lightness Races in Orbit, May 24 '14 at 06:05

score 1 · Answer 1 · answered May 24 '14 at 06:06

1

Why not doing this?

$('.nav-sidebar > .active, .nav>li').hover(function(){
   $(this).css("border-color", "blue");
});

answered May 24 '14 at 06:06

Dhaval Marthak

17,246
6
46
68

1

Thanks, this helped. Not sure why I didn't think of that. :D – Veloncia May 24 '14 at 06:10

score 0 · Answer 2 · answered May 24 '14 at 06:31

you can not use :hover selector in jquery like we do in css pseudo-classes selector.

In Jquery you can bind hover event using .hover()

Try this:

$('.nav-sidebar').css("border-color", "blue");
$('.nav-sidebar').hover(function(){
   $(this).css("border-color", "blue");
});

JQUERY .css() with :hover pseudo-class

2 Answers2