JO JOJO
JO JOJO

Reputation: 105

Hover all element in html

Is there any way to add hover on all elements in html (div,p,span,a...) I'm trying like this:

$("*").hover(
      function () {
              $(this).addClass('hover'); ;
      },
      function () {
              $(this).removeClass('hover');
      }
    );

and CSS

#hover {
     background-color:#CC0000;
}

but somewhere there is an error???

Upvotes: 1

Views: 1073

Answers (3)

ninov
ninov

Reputation: 639

jlis solution will work, but there is a better way:

Use the css pseudo class ":hover" instead:

*:hover {
     background-color: #CC0000;
}

should work with most common and actual browsers.

(IE 6 is not an actual or common browser!)

Upvotes: 1

jli
jli

Reputation: 6623

You should be using a . rather than a # to denote a class selector.

.hover {
    background-color:#CC0000;
}

Also, note that using * as a jQuery selector will select everything, including the body element etc. I'm not sure from the context of the question whether this is what you're after or not.

Furthermore, it would be easier to just use the CSS pseudo-class :hover to apply a style to a hovered element. Here's a reference for how to use it: http://reference.sitepoint.com/css/pseudoclass-hover

Upvotes: 6

haynar
haynar

Reputation: 6040

You adding class "hover", but using CSS # selector for ids, use .hover instead of #hover

Upvotes: 4

Related Questions