search

danielstocks / jQuery-Collapse

A lightweight (~1kb) jQuery plugin that enables expanding and collapsing content
http://webcloud.se/jQuery-Collapse/
MIT License
679 stars 153 forks source link

show/hide bug in IE8 #36

Closed 0x-r4bbit closed 11 years ago

0x-r4bbit commented 11 years ago

Hey you guys, I found a bug and was wondering, if you can reproduce it.

So, I'm using jQuery 1.8.2 and the current version of jQuery-Collapse. Everything works fine so far, the plugin is suggestible and the code is pretty slim. Unfortunately, there's a bug in IE8 when it comes to show and hide the 'details' of a summarized content.

I debugged the whole way down up to line 113. This line does nothing more then showing or hiding content whether '_this.isOpen' is true or not. And just like I said, this works great in all browsers, except the IE8.

So, it seems like the show() and hide() methods aren't working in IE8, so I wrote a little jsbin-fiddle to test it out. I thought, maybe the jQuery version I use is too new for IE8. Wrong. The fiddle works in IE8. This means, hiding and showing elements just doesn't work in this plugin when using IE8.

Since show() and hide() aren't any dark magic (it's more or less just a css 'display: none' or 'display:block'), I replaced the expressions in line 113 with jQuery's css() method to figure out this works.

_this.isOpen ? _this.$details.css('display', 'block') : _this.$details.css('display', 'none');

Et voila! This works in IE8. So my question:

Can anybody of you reproduce this issue?

0x-r4bbit commented 11 years ago

So, it turned out that the display behavior isn't changeable when the display style is set. In my case I have a .js.hidden class which sets an element to display: none. This is made because when a user hasn't javascript enabled, the content should be shown always.

Anyways. The weird thing: when I comment these few lines (disabling this class) everything works fine. I think I have to dig a bit deeper into IE8 inline style behavior in combination with jQuery show() and hide() methods.

danielstocks commented 11 years ago

Hey! Thanks for digging into this.

It sounds weird. I've never encountered such behavior. I mean inline styles (as far as i know) always have a higher precedence in all IE versions I've worked with. I'll see if i can reproduce it here. Let me know if you find anything interesting.