xela84
xela84

Reputation: 312

jQuery UI Accordion - Internet Explorer ugly box shadow after slide effekt

Can someone tell me please, how to avoid the ugly box-shadow in Internet Explorer? After the accordion has closed, the box-shadow of the parent DIV has a ugly effect.

It only happens on an absolute positioned parent DIV:

The JavaScript:

$(function() { $( "#accordion" ).accordion({ heightStyle: "content", collapsible: true, active: false }); });

The CSS:

accordion{

box-shadow: 0 4px 8px #999;
position:absolute;
width:400px; }

Here is a fiddle (please open in Internet Explorer)

http://jsfiddle.net/9s5bb/1/

Upvotes: 0

Views: 401

Answers (2)

Florian Haider
Florian Haider

Reputation: 1912

Seems to be a browser bug, but if you specify a height value in your CSS the ugly shadow effect disappears:

http://jsfiddle.net/9s5bb/7/

Upvotes: 0

Feco Linhares
Feco Linhares

Reputation: 56

I'm sorry to say, but remove the box-shadow effect (on #accordion) for IE Browsers (i guess, only IE9 or less). IE is not a great browser to manipulate an animation with "modern" effects (even with filter attribute on css). I recommend you to use something like Progressive Enhancement (or Graceful Degradation) and have less stress with old versions of this browser.

Upvotes: 0

Related Questions