Support » Plugin: Easy FancyBox » [Plugin: Easy FancyBox] Not Working in Internet Explorer?

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author RavanH


    Looking at the source code of your page, I notice that the code starts with :

    <!--[if IE]>
    	<style type="text/css">
    		#fullcontentwrap {display:table;height:100%}
    		#quotearea {height: 140px;}
    		#footer {margin-top: -20px;}
    <!--Updated Home page-->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <html xmlns="" dir="ltr" lang="en-US">
    <head profile="">

    I that is likely to cause problems. Please move EVERYTHING (including all blank lines) that is currently above <!DOCTYPE... to BELOW the <head... line.

    I have made the change as requested, but still have the same issue.

    Plugin Author RavanH


    The source code still looks the same from here… Open the page in IE and right-click on an empty part like left or right of the main content. Select “View source…” (or similar, in your language) and tell me what you see at the top of the document that opens in Wordpad.

    My apologies, I had not committed the update. It is now changed, but with the same white window.

    The first several lines of the source are below:

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”>
    <html xmlns=”” dir=”ltr” lang=”en-US”>

    <head profile=”″>

    <!–[if IE]>
    <style type=”text/css”>
    #fullcontentwrap {display:table;height:100%}
    #quotearea {height: 140px;}
    #footer {margin-top: -20px;}

    <link rel=”icon” type=”image/png” href=””>

    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />

    <title> » TEST2 – Digital Facilities™ that Improve Safety and Decision-Making for Building, Managing and Upgrading Facility Assets</title>

    <meta name=”generator” content=”WordPress 3.0.5″ /> <!– leave this for stats –>
    <meta name=”description” content=”Quantapoint – Laser Scanning Technology and Services for Zero-Defect Projects” />
    <meta name=”keywords” content=”Quantapoint – Digital Facilities™ that Improve Safety and Decision-Making for Building, Managing and Upgrading Facility Assets” />
    <link rel=”stylesheet” href=”” type=”text/css” media=”all” />
    <link rel=”alternate” type=”application/rss+xml” title=”Quantapoint RSS Feed” href=”” />
    <link rel=”pingback” href=”” />
    <script type=”text/javascript” src=””></script>
    <style type=”text/css” media=”screen”>


    Plugin Author RavanH


    It’s weird… I do not see any errors in console nor in the FancyBox markup. So I’m guessing the problem stemms from somewhere else. If you open you will notice there are a lot of XHTML errors. Please take care of the first two (marked with a red X button) to see if that will take away many of the other errors there. And hopefully get the FancyBox working in IE too.

    I corrected the two “x”‘s, but the other problems are still listed. It looks as if it is mis-interpreting the JavaScript as errors.

    Unfortunately, this did not fix the issue. I really do appreciate your time and efforts.

    Note that I inspected the fancybox using the Firebug plug-in and it looks as if the image name itself is not being passed (when compared to FireFox).

    I will re-enable for the page, if this will help you.

    In Firebug, I am getting an “Access to restricted URI denied.” for the Fancybox script. I looked it up at, but am not sure what it means.

    Plugin Author RavanH


    That “Access to restricted URI denied” error is supposed to prevent cross-site scripting. I have no idea why IE thinks there is something like that going on.

    It looks as if it is mis-interpreting the JavaScript as errors.

    I noticed that too. You can prevent that in the following way. Wrap all javascript like this:

    <script type="text/javascript">
    /* <![CDATA[ */
    ... (all javascript here) ...
    /* ]]> */

    My plugin does this already for it’s own code but if you can make that happen for the other scripts in your header, we should get rid of most of the 170 errors… And hopefully closer to discovering what’s going wrong.

    Ok, not sure if I’m interpreting properly where your problem is occurring, but try adding this to your stylesheet:

    #fancybox-content img {
        visibility: visible !important;

    What’s happening is IE is picking up some weird style that is forcing the image within the overlay to have a visibility: invisible;…which is hiding your pics. As soon as I delete that line, they appear in IE. Test it out and let me know what you come up with.

    Oh yeah, I guess you could use this too:

    #fancybox-content img {
        visibility: inherit !important;

    Visible vs. inherit…in your case it won’t make much difference, the results should be the same. Good luck!

    That did it!

    I spent hours researching and trying different things. I am very grateful for your help!

    Glad to hear man. While the Developer Toolbar for IE is no comparison to Firebug, it does come in handy from time to time. 🙂

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘[Plugin: Easy FancyBox] Not Working in Internet Explorer?’ is closed to new replies.