Thursday, August 1, 2019

javascript - How can I remove a style added with .css() function?

There are several ways to remove a CSS property using jQuery:



1. Setting the CSS property to its default (initial) value




.css("background-color", "transparent")


See the initial value for the CSS property at MDN.
Here the default value is transparent. You can also use inherit for several CSS properties to inherite the attribute from its parent. In CSS3/CSS4, you may also use initial, revert or unset but these keywords may have limited browser support.



2. Removing the CSS property



An empty string removes the CSS property, i.e.




.css("background-color","")


But beware, as specified in jQuery .css() documentation, this removes the property but it has compatibilty issues with IE8 for certain CSS shorthand properties, including background.




Setting the value of a style property to an empty string — e.g.
$('#mydiv').css('color', '') — removes that property from an element
if it has already been directly applied, whether in the HTML style

attribute, through jQuery's .css() method, or through direct DOM
manipulation of the style property. It does not, however, remove a
style that has been applied with a CSS rule in a stylesheet or
element. Warning: one notable exception is that, for IE 8 and below,
removing a shorthand property such as border or background will
remove that style entirely from the element, regardless of what is set
in a stylesheet or element
.




3. Removing the whole style of the element




.removeAttr("style")

No comments:

Post a Comment

plot explanation - Why did Peaches' mom hang on the tree? - Movies & TV

In the middle of the movie Ice Age: Continental Drift Peaches' mom asked Peaches to go to sleep. Then, she hung on the tree. This parti...