How to remove z-index: 1000 !important of an element using jquery?

Question

#admin-toolbar, #yoxview_popupWrap {
z-index: 500 !important;

}

How can i change the above one to

#admin-toolbar, #yoxview_popupWrap {
z-index: 1500 !important;

} using jquery.

this post will help http://stackoverflow.com/questions/2655925/how-to-apply-important-using-css — charlietfl, Sep 16 '14 at 07:16

Control Freak · Answer 1 · 2014-09-16T07:14:49.293

3

$("#admin-toolbar").css("z-index","1500");

Adds it to an element, which has priority over !important

Edit:

Since this does not work the same way with jQuery, and will not override an !important tag, what you can do is create a seperate style that proceeds & over-rides your current style.

#admin-toolbar, #yoxview_popupWrap {
z-index: 1500 !important;
}

#admin-toolbar.less, #yoxview_popupWrap.less {
z-index: 1000 !important;
}

Here we just added a .less class to the same object, in case you would like to shrink the z-index

You would then apply the style .less to your element in jQuery like this:

$("#admin-toolbar").addClass("less")

and it will over-ride the existing value.

edited Sep 16 '14 at 07:14

answered Sep 16 '14 at 07:07

Control Freak

12,965
30
94
145

hope that also work but i am doing this addclass and removeclass to rotate images inside these #admin-toolbar, #yoxview_popupWrap. if i change css for that class then image rotation will not get occur. – Shridhar Sep 17 '14 at 07:32
Don't see how else you're going to get this to work. – Control Freak Sep 17 '14 at 07:33

How to remove z-index: 1000 !important of an element using jquery?

1 Answers1

Edit: