jQuery - Making fadeOUt use !important

Question

I have created a jQuery widget for other people to embed on their website, and within the widget I am using a css reset stylesheet called "cleanslate" from here:

https://github.com/premasagar/cleanslate

This stops the page style creeping into my widget.

Problem is that my fadeOut and fadeIn's are no longer working because the reset style is overriding the display inline style jQuery is adding. I need to make the fadeOut function add !important; to the inline style.

Does anyone know if this is possible?

Thanks in advance.

The !important is pertaining to CSS. You cannot apply it to jQuery. Can you paste your code — MarsOne, Oct 17 '13 at 10:43
look here: http://stackoverflow.com/questions/2655925/apply-important-css-style-using-jquery hope that helped. — geevee, Oct 17 '13 at 10:44
@MarsOne I want jQuery to add !important to the `display:` style it adds to the element when I use `$('#element').fadeOut('slow');` <-- all that does is add display: none, and drop the opacity. I need it to add `display: none !important`... — superphonic, Oct 17 '13 at 10:53
I just did... `$('#element').fadeOut('slow');` #element is a — superphonic, Oct 17 '13 at 10:55

score 7 · Accepted Answer · answered Oct 17 '13 at 11:30

7

I came up with the solution below, hope it helps someone else in the same situation.

All comments / improvements welcome:

    jQuery("element").fadeOut("slow", function() {
        jQuery("element").attr("style", "display: none !important");
    });

Thanks

answered Oct 17 '13 at 11:30

superphonic

7,954
6
30
63

for me at the end there is no fadeout effect, but it will hide – Marc_78 Oct 16 '20 at 04:49

jQuery - Making fadeOUt use !important

1 Answers1