Remove / untie anchor guidance

Question

HTML

<a href="home.html">Home</a> 

CSS

 a { color: blue; } a:hover { color: red; } 

now, as you can see, <a> will now be red on hover.

Question
How to remove freeze through jQuery?
I tried: $('a').unbind('hover'); and $('a').unbind('mouseenter mouseleave')

I think why this will not work, is it not hover() ?

Answer 1

Since a:hover not a bound event in the binding tag and is only a pseudo-class, you will not have success canceling the .hover () event.

If you want to change behavior, you can do two things.

• remove a:hover styles

• bind hover event to bind tag and set css accordingly.

Answer 2

Not. This is a CSS rule, not a JavaScript event.
The easiest way to change the color is with a stronger CSS rule, for example:

 a.NoHover:hover { color: blue; } 

or

 body a:hover { color: blue; } 

Answer 3

You can add / remove classes and use jQuery to perform the appropriate actions. Therefore, you must create classes for both normal and hovering. For example, you can remove a style from an element as follows:

 $('a').mouseover(function(){ $(this).removeClass(); }); 

But I would suggest you add and remove classes using:

addClass ()
removeClass ()

Answer 4

If this color may bother you, this may help.

 $('a').each(function() { var $this = $(this); $this.css('color', $this.css('color')); }); 

The style property will override the properties set in any CSS selectors. The theory has been tested and works great. This plugin will read arbitrary css properties and set them back, therefore, "sticking" them.

 $.fn.stickCss = function(props) { var stick = (props || '').split(/\s+/); return this.each(function() { var $this = $(this); $.each(stick, function(i, prop) { $this.css(prop, $this.css(prop)); }); }); }; // example usage: $('a').stickCss('color background-color margin padding');