Reputation: 165
I have a page where overflow-x is forced hidden(using !important) due to the usage of a css file(UIFix.css). But I need to have scrollbar visible. I can't modify the UIFix.css file.So I added the following at the end of the page below the UIFix.css file and it works.
<style>
body{overflow-x: scroll !important;}
</style>
However I want to make this fix using javascript instead of keeping the tags at the end of the page. I am trying the below piece of code on document load, but it does not work.
$('body').css('overflow-x','scroll','important');
I tried the above from chrome console and it did not work.
Upvotes: 1
Views: 217
Reputation: 3260
You can create a css class that has your desired css such as:
.overflow-x-scroll {
overflow-x: scroll !important;
}
Then add the class to the element with addClass()
:
$("body").addClass("overflow-x-scroll");
Upvotes: 1
Reputation: 19111
You can achieve this using cssText
.
$('body').css('cssText', 'overflow-x: scroll !important;');
Upvotes: 1