We encountered an IE9 bug relating to modal forms using ctools.

When we click on a link that opens a modal form in IE9, the form appears with the throbber, then disappears, and later, reappears. When it reappears, it contains the correct modal form. The unwanted behaviour is that the 'modal box' flickers - it disappears and then reappears. Sometimes it won't even re-appear until the mouse is moved or clicked.

Other browsers do not exhibit this behaviour.

After investigation, this looks like an IE9 bug. The container #modalContent temporarily disappears. It's css width is set to 'auto', but IE9 resizes it to zero width - possibly as a result of the contents of #modalContent being deleted - and doesn't resize it back to the correct width until later.

We have a possible fix for this issue. By setting an explicit width for #modalContent at the beginning, IE9 doesn't incorrectly resize it to zero width later. This has fixed the flickering behaviour in all our tests so far.

Please see the attached patch.

Feel free to mangle it, or relocate the fix to somewhere else. We're not sure whether the fix may affect other parts of CTools accidentally, or it may not fit the maintainers' code styles.

Comments

Ashlar’s picture

Thanks for the report.

jlopez’s picture

I am experiencing the same behavior with IE9 and Chaos tool suite version 7.x-1.0. The fix also corrected my issue. Thanks!

codycraven’s picture

Version: 6.x-1.x-dev » 7.x-1.x-dev
Status: Needs review » Reviewed & tested by the community

Our QA team confirmed this issue on 7.x-1.x. The patch supplied corrects the issue.

japerry’s picture

Issue summary: View changes
Status: Reviewed & tested by the community » Needs review
StatusFileSize
new773 bytes

While I'm probably not in favor of accepting IE9 bugs, here is an updated patch for d7.

chris matthews’s picture

The 4 year old patch in #4 to modal.js sill applies cleanly to the latest 7.x-1.x-dev, but still needs reviewing and testing.

Checking patch js/modal.js...
Hunk #1 succeeded at 558 (offset 117 lines).
Applied patch js/modal.js cleanly.