WordPress.org

Ready to get started?Download WordPress

Forums

NextGEN Gallery Optimizer
[resolved] NextGen FancyBox Opacity (4 posts)

  1. johannesohlsson
    Member
    Posted 1 year ago #

    I'm having trouble getting the settings right for the FancyBox. Especially regarding the opacity of the overlay. I have tried changing the value in all of the following files:

    jquery.fancybox-1.3.4.pack.js
    jquery.fancybox-1.3.4.js
    jquery.fancybox-1.3.4.css

    But it ignores my settings. Where do I need to change the values?

    http://wordpress.org/extend/plugins/nextgen-gallery-optimizer/

  2. Mark Jeldi
    Member
    Plugin Author

    Posted 1 year ago #

    Hi Johannes,

    Thanks for using NextGEN Gallery Optimizer!

    To adjust the overlay opacity in Fancybox, simply open wp-content/plugins/nextgen-gallery-optimizer/nextgen-optimizer-scripts-and-styles.php and replace the "fancybox inline js" section at the top with the following...

    For the Basic version of Optimizer...

    /**********************************************************************
    * fancybox inline js
    **********************************************************************/
    
    function nggo_fancybox_inline_js() { ?>
    <!-- [nextgen gallery optimizer v<?php echo NGGO_VERSION; ?>] This page must contain a nextgen shortcode...else we wouldn't be serving its scripts and styles -->
    <script type='text/javascript'>jQuery.noConflict(); jQuery(document).ready(function() { jQuery('a.myfancybox').fancybox({ 'zoomSpeedIn':500, 'zoomSpeedOut':500, 'overlayShow':true, 'overlayOpacity':0.3, 'overlayColor':'#666', 'titlePosition':'float' }); });</script>
    <?php
    }

    And for the Premium version...

    /**********************************************************************
    * fancybox inline js
    **********************************************************************/
    
    function nggop_fancybox_inline_js() { ?>
    <!-- [nextgen gallery optimizer premium v<?php echo NGGOP_VERSION; ?>] This page must contain a nextgen shortcode...else we wouldn't be serving its scripts and styles -->
    <script type='text/javascript'>jQuery.noConflict(); jQuery(document).ready(function() { jQuery('a.myfancybox').fancybox({ 'zoomSpeedIn':500, 'zoomSpeedOut':500, 'overlayShow':true, 'overlayOpacity':0.3, 'overlayColor':'#666', 'titlePosition':'float' }); }); var timer; jQuery(window).resize(function() { clearTimeout(timer); timer = setTimeout(jQuery.fancybox.browser_resize, 500); });</script>
    <?php
    }

    I've added three extra settings here which you can modify, including overlay opacity, overlay color and title position (which can be either float, over, inside, outside or none).

    You can also see Fancybox's API page for other options you might like to add.

    Hope this helps!

    Cheers,
    Mark.

  3. johannesohlsson
    Member
    Posted 1 year ago #

    Ah... not the most logical place, but thanks! Yes that worked :)

    I find it a bit confusing having the same settings in so many places. These exact values can be found in no less than 4(!) different files (if you choose to enter it into the css-file). But perhaps I've missed a readme or two.

    Anyhow: Thanks again!

  4. Mark Jeldi
    Member
    Plugin Author

    Posted 1 year ago #

    Hi Johannes,

    That's great to hear! :)

    The defaults at the bottom of jquery.fancybox-1.3.4.pack.js can also be modified, but the above is much easier as it's not minified.

    Cheers,
    Mark.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic