Advanced Search

R2C - Fancybox Setup

/ Published in: HTML
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <script type="text/javascript" src="js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
  2. <script type="text/javascript" src="js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
  3. <link rel="stylesheet" type="text/css" href="js/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
  4.  
  5. <script type="text/javascript">
  6.  \$(document).ready(function() {
  7.  
  8.          /* Basic Fancybox example */
  9.          \$("a#example2").fancybox({
  10.             'overlayShow' : true,
  11.             'overlayColor'   : '#000',
  12.             'overlayOpacity' : 0.4,
  13.             'transitionIn'  : 'elastic',
  14.             'transitionOut' : 'elastic',
  15.             'titlePosition'    : 'over'
  16.           });
  17.  
  18.          /* Gallery Fancybox example */
  19.          \$("a[rel=example_group]").fancybox({
  20.             'transitionIn'   : 'elastic',
  21.             'transitionOut'    : 'elastic',
  22.             'titlePosition'  : 'over',
  23.             'titleFormat'    : function(title, currentArray, currentIndex, currentOpts) {
  24.             return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
  25.             }
  26.           });
  27.  
  28.  });
  29. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.