Recent Changes - Search:

Cookbook

PmWiki

pmwiki.org

Mini with Fancybox

Summary: Fancybox jQuery slideshow for the Mini gallery
Version: 20110817
Prerequisites: Mini version 20110817 or newer
Status: experimental
Maintainer: Petko
Categories: Images, Uploads, Gallery
Users: +1 (view / edit)
Discussion: MiniFancybox-Talk?
License: MIT/GPL3

Description

Use the Mini gallery with Fancybox instead of Ultralightbox.

This recipe enables Fancybox for Mini. Fancybox is a slideshow similar to Ultralightbox, but has a slightly different look and feel and a few more configuration options. Fancybox is built on the jQuery library.

Demo.

Installation

You need a working Mini installation version 20110817 or newer. This recipe is a plugin for Mini.

  • Get mini-fancybox.zipΔ (alt. download: mini-fancybox.zip).
  • Copy the folder fancybox to your pmwiki/pub directory.
  • Add to local/config.php these lines:
    $Mini['LbUrl'] = '$FarmPubDirUrl/fancybox';
    $Mini['LbFiles'] = array('jquery-1.4.4.min.js', 'jquery.fancybox-1.3.4.pack.js',
      'mini-fancybox.js', 'jquery.fancybox-1.3.4.css');
    

Configuration

The recipe has the following parameters in config.php:

  • $Mini['EnableLightbox'] = 1; this variable works the same way as with Ultralightbox, see Mini. It can be 1, 2 or 3.
  • $Mini['LbFiles'] = array(...); this variable controls the loading of all scripts and styles. The jQuery library should be loaded before all plugins. If your site already loads the library, you can disable it here: write array('jquery.fancybox-1.3.4.pack.js', 'mini-fancybox.js', 'jquery.fancybox-1.3.4.css') that is without the first 'jquery...js'.

You can change the parameters passed to Fancybox at the beginning of the file pub/fancybox/mini-fancybox.js. Refer to fancybox.net/api for the different options. For example, the title of the picture can be one of 3 different positions, 'inside', 'outside', and 'over', it is changed in the line:

  'titlePosition' : 'inside',

If you add new parameters, just make sure all lines in the block "MiniFancyboxOptions{};" end with a comma except the last one, for example:

  'transitionIn' : 'elastic'

Usage

The Fancybox recipe works mostly like Ultralightbox (see Mini). Users with recent browsers will see a nice slideshow when they click on a thumbnail. Visitors with JavaScript disabled will see the large pictures in their browsers without any special effects.

Notes

The recipe requires Mini version 20110817 or newer.

Change log / Release notes

  • 20110817 The recipe was modified to work with the new package integration format in Mini version 20110817. There is no more a file "mini-fancybox.php" and if you upgrade, you should delete the line which previously included it.
  • 20110217 first experimental release.

See also

Contributors

This PmWiki recipe is written and maintained by Petko. Fancybox is written by Janis Skarnelis. The jQuery library is written by John Resig. The sizzle.js library is written by the Dojo Foundation.

Comments

See discussion at MiniFancybox-Talk?

User notes +1: If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.

Edit - History - Print - Recent Changes - Search
Page last modified on July 18, 2014, at 01:58 AM