Colorbox iFrame content not appearing in IE 8/9

Question

I'm using ColorBox to call a few informational modals on-screen and given the client's requirements, the best way to do this is via iFrames (not my first choice but whatever). Everything is working peachy in Chrome, FF, etc. but the iFrame content is not working in any version of IE. The modal wrapper appears but nothing is inside. This is what I've done so far:

Changed the doctype to transitional and strict for IE. No dice.
Removed the "iframe: true" and replaced it with HTML "Hello". That worked fine and "Hello" appeared in the Colorbox modal.
I've removed all stylesheets from the header. No luck so it's not a CSS issue.
Just to be sure, I rolled back my JQuery library to 1.6.2 from 1.8.2. Nothing there, either.

Any help would be appreciated. This is aggravating.

Some code:

 $(function ()
{
    $(".modal-large").colorbox({iframe:true, innerWidth:580, innerHeight:500});
})

HTML:

<div class="top-droptext"><a class="modal-large" href="modal/serviceproviderinfo.html">Update Password</a></div>

Answer 1

It's doctype issue. You need to add this to beginning of your colorbox caller page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Colorbox iFrame content not appearing in IE 8/9

Question

1 answers

solution1
0 2012-12-05 17:01:13

Colorbox iFrame content not appearing in IE 8/9

Question

1 answers

solution1 0 2012-12-05 17:01:13

solution1
0 2012-12-05 17:01:13