Support » Plugin: Easy FancyBox » [Plugin: Easy FancyBox] Images & Inline not displaying correctly

  • Resolved nef426


    I am using Easy Fancybox, calling it manually for images and inline content. When i do so, however the box appears with the height and width set to 0, and aligned top left. If i manually expand the boxes dimensions with CSS + firebug, the image/content is visible underneath — I have tried messing with the ‘box size’ options under settings-media, however this doesn’t appear to help anything… Additionally the close button is set to ‘display:none;’ and if i force it to display it doesn’t function.

    The plugin works fine for iframes and youtube items, provided i use the classes fancybox-iframe, and fancybox-youtube.

    Any ideas?

    Thanks in Advance for any suggestions.

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


    check your page source code to see if the main jQuery library is being loaded twice, or if the easing script file is missing due to missing wp_footer() call in your themes footer.php

    Thanks for the quick reply –

    wp_footer() is being called in the footer.php file – and the easing script is present.

    I’ve double checked and the jQuery library is not being loaded twice.

    WP – 3.3.1
    Easy Fancybox –

    any other thoughts?

    Plugin Author RavanH


    And accessing the easing script file directly (use the URL present in your source) does indeed return the script? And what about the stylesheet referenced in the source header?

    Do you have a developer toolbar on your browser to see what javascript errors occur?

    Otherwise, I’ll need a link to your site to find out more…

    I believe I’m getting the same issue. It’s something to do with the Elastic transitions I think, because when I click the Fancybox image link, Console gives me this error:
    f.easing[i.animatedProperties[this.prop]] is not a function

    A temporary fix is to go to the Easy Fancybox settings and change transitions to Fade. Hopefully this is somewhat helpful.

    Yup, same issue as alphaalec, switching to fade ‘solves’ the issue (thanks!) — upon further inspection i get the same error that alphaalec referenced above:

    f.easing[i.animatedProperties[this.prop]] is not a function

    This is slightly beyond my knowledge span, but maybe the Easing library for those transitions isn’t be linked to properly?

    Plugin Author RavanH


    @all, I’ll need links to live examples to check wy the easing script is failing…

    I’ve put my settings back to Elastic, see here:

    The link I have hooked up to FancyBox is the Preview Wallpaper link under Angle Fractal.

    Plugin Author RavanH


    alphaalec, there is a hardcoded inclusion of the main jQuery library in your theme header.php template source that results in double loading of (different versions of) the library:

    <script type="text/javascript" src=""></script>

    Please remove it or replace with an if statement.

    Plus some remaining stylesheet that might have some impact here:

    <link rel='stylesheet' id='woocommerce_fancybox_styles-css'  href='' type='text/css' media='all' />

    There we go, that solved it! I just had to remove the hardcoded inclusion. Many thanks.

    Plugin Author RavanH


    nef426, could you check for double inclusion of the jquery library on your site too? You’ll find it in the source code either named jquery.min.js or jquery.js …


    I finally found the extra JQuery inclusion buried in the content body — scoured the last time<head> and footer of the site with firebug, but didn’t find it. Once i deactivated the one i found in the body, i was able to get the elastic transitions working.

    Thanks for your help on this one —

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Plugin: Easy FancyBox] Images & Inline not displaying correctly’ is closed to new replies.