How to overwrite an !important CSS property in jQuery

Question

I have css on my page's body and I would like to overwrite overflow: visible !important;. I have tried the jQuery script below, but that doesn't do it"

 jQuery("body, #s4-workspace").css("overflow", "hidden !important");

CSS:

body, #s4-workspace {
    overflow: visible !important;
}

body {
    height: 100%;
    overflow: hidden; //overriden
    width: 100%;
}

I know there are two overflow already, but sadly I don't have the hand on that, otherwise it would be too easy, wouldn't it?

or is there a way to just remove overflow: visible !important; — user472285
– user472285, Commented Jun 28, 2011 at 12:52

No Results Found · Accepted Answer · 2011-06-28 12:54:57Z

1

As mentioned, ! important is not handled well by jQuery's css().

Here is a hack that will work if you don't mind overwriting the inline style attribute value (if it exists):

 jQuery("body, #s4-workspace")
     .attr("style", "overflow:hidden !important");

Like I said, it's a hack - but give it a try.

Demo: http://jsfiddle.net/dGbaD/

edited Jun 28, 2011 at 12:54

answered Jun 28, 2011 at 12:47

No Results Found

103k38 gold badges199 silver badges232 bronze badges

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

2 Comments

user472285 Over a year ago

or is there a way to just remove overflow: visible !important;

No Results Found Over a year ago

I don't think you can just "remove" it, it must be set to another value. Check the demo and see if that helps, I revised the errors in my previous answer.

Pablo Fernandez · Accepted Answer · 2011-06-28 12:39:06Z

1

AFAIK jQuery does not understand the !important part.

Try creating a class, like this:

.newClass {
   overflow: hidden !important;
}

And then set the class like this:

jQuery("body, #s4-workspace").addClass('newClass');

answered Jun 28, 2011 at 12:39

Pablo Fernandez

106k59 gold badges196 silver badges234 bronze badges

2 Comments

user472285 Over a year ago

or is there a way to just remove overflow: visible !important;

Pablo Fernandez Over a year ago

you could remove it if it was set in a class

Community · Accepted Answer · 2017-05-23 12:08:09Z

0

jQuery can't manage !important rules.

See:

How to apply !important using .css()?

http://hungred.com/how-to/jquery-javascript-css-important/

edited May 23, 2017 at 12:08

CommunityBot

11 silver badge

answered Jun 28, 2011 at 12:36

jjmontes

27.2k5 gold badges47 silver badges53 bronze badges

Collectives™ on Stack Overflow

How to overwrite an !important CSS property in jQuery

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related