0

I have a simple div with a few html elements within. There is a link in the div, which when clicked, pops up a jquery dialog.
The dialog displays well and I've attached some effects to the dialog for open and close. The open effect works well; however, when i close the dialog, the explode effect goes behind the div from where the dialog was opened.
The dialog closes as expected and I see the exploding effect behind the div when I'm expecting it to explode in front of the div. I tried setting the z-index to a high number on the dialog div, but no change in the behavior.

Browser is IE8

Bob76
  • 477
  • 1
  • 5
  • 12
  • You need to add Z-Index higher than the number on the div –  Mar 20 '14 at 14:06
  • I had tried that and set it to 9999, but still no luck – Bob76 Mar 20 '14 at 14:06
  • Here is a fiddle on what I'm trying to do, but I don't see the issue on the fiddle [link]http://jsfiddle.net/bobm76/p5w4a/1/ – Bob76 Mar 20 '14 at 14:59
  • @Bob76 make sure the divs in question are positioned (e.g. have a `position` of `absolute`, `relative` or `fixed`). default `static` positioned elements won't respond to `z-index` so give everything involved `position: relative` – Ennui Mar 20 '14 at 15:01
  • Thanks Ennui. I've updated the fiddle to reflect the actual code that has position for both divs. I still don't see the issue when i run the code in the fiddle, but see the issue when i run it in my app. Unfortunately, I'm not able to access the fiddle from my work computer running IE8 and so I'm not sure if its to do with the browser itself. – Bob76 Mar 20 '14 at 15:11

0 Answers0