starhunter
starhunter

Reputation: 165

Setting overflow scroll using javascript

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

Answers (2)

phuwin
phuwin

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

Andy Hoffman
Andy Hoffman

Reputation: 19111

You can achieve this using cssText.

$('body').css('cssText', 'overflow-x: scroll !important;');

Upvotes: 1

Related Questions