Colorbox vs Fancybox (v5)

Revision 5 of this benchmark created on

Preparation HTML

<script src="//code.jquery.com/jquery-1.8.3.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
Colorbox
// ColorBox v1.3.20.2 - jQuery lightbox plugin
// (c) 2012 Jack Moore - jacklmoore.com
// License: http://www.opensource.org/licenses/mit-license.php
(function($, document, window) {
  var
  // Default settings object.
  // See http://jacklmoore.com/colorbox for details.
  defaults = {
    transition: "elastic",
    speed: 300,
    width: false,
    initialWidth: "600",
    innerWidth: false,
    maxWidth: false,
    height: false,
    initialHeight: "450",
    innerHeight: false,
    maxHeight: false,
    scalePhotos: true,
    scrolling: true,
    inline: false,
    html: false,
    iframe: false,
    fastIframe: true,
    photo: false,
    href: false,
    title: false,
    rel: false,
    opacity: 0.9,
    preloading: true,

    current: "image {current} of {total}",
    previous: "previous",
    next: "next",
    close: "close",
    xhrError: "This content failed to load.",
    imgError: "This image failed to load.",

    open: false,
    returnFocus: true,
    reposition: true,
    loop: true,
    slideshow: false,
    slideshowAuto: true,
    slideshowSpeed: 2500,
    slideshowStart: "start slideshow",
    slideshowStop: "stop slideshow",
    onOpen: false,
    onLoad: false,
    onComplete: false,
    onCleanup: false,
    onClosed: false,
    overlayClose: true,
    escKey: true,
    arrowKey: true,
    top: false,
    bottom: false,
    left: false,
    right: false,
    fixed: false,
    data: undefined
  },

    // Abstracting the HTML and event identifiers for easy rebranding
    colorbox = 'colorbox',
    prefix = 'cbox',
    boxElement = prefix + 'Element',

    // Events
    event_open = prefix + '_open',
    event_load = prefix + '_load',
    event_complete = prefix + '_complete',
    event_cleanup = prefix + '_cleanup',
    event_closed = prefix + '_closed',
    event_purge = prefix + '_purge',

    // Special Handling for IE
    isIE = !$.support.leadingWhitespace, // IE6 to IE8
    isIE6 = isIE && !window.XMLHttpRequest, // IE6
    event_ie6 = prefix + '_IE6',

    // Cached jQuery Object Variables
    $overlay,
    $box,
    $wrap,
    $content,
    $topBorder,
    $leftBorder,
    $rightBorder,
    $bottomBorder,
    $related,
    $window,
    $loaded,
    $loadingBay,
    $loadingOverlay,
    $title,
    $current,
    $slideshow,
    $next,
    $prev,
    $close,
    $groupControls,

    // Variables for cached values or use across multiple functions
    settings,
    interfaceHeight,
    interfaceWidth,
    loadedHeight,
    loadedWidth,
    element,
    index,
    photo,
    open,
    active,
    closing,
    loadingTimer,
    publicMethod,
    div = "div",
    init;

  // ****************
  // HELPER FUNCTIONS
  // ****************

  // Convience function for creating new jQuery objects

  function $tag(tag, id, css) {
    var element = document.createElement(tag);

    if (id) {
      element.id = prefix + id;
    }

    if (css) {
      element.style.cssText = css;
    }

    return $(element);
  }

  // Determine the next and previous members in a group.

  function getIndex(increment) {
    var
    max = $related.length,
      newIndex = (index + increment) % max;

    return (newIndex < 0) ? max + newIndex : newIndex;
  }

  // Convert '%' and 'px' values to integers

  function setSize(size, dimension) {
    return Math.round((/%/.test(size) ? ((dimension === 'x' ? $window.width() : $window.height()) / 100) : 1) * parseInt(size, 10));
  }

  // Checks an href to see if it is a photo.
  // There is a force photo option (photo: true) for hrefs that cannot be matched by this regex.

  function isImage(url) {
    return settings.photo || /\.(gif|png|jp(e|g|eg)|bmp|ico)((#|\?).*)?$/i.test(url);
  }

  // Assigns function results to their respective properties

  function makeSettings() {
    var i,
      data = $.data(element, colorbox);

    if (data == null) {
      settings = $.extend({}, defaults);
      if (console && console.log) {
        console.log('Error: cboxElement missing settings object');
      }
    } else {
      settings = $.extend({}, data);
    }

    for (i in settings) {
      if ($.isFunction(settings[i]) && i.slice(0, 2) !== 'on') { // checks to make sure the function isn't one of the callbacks, they will be handled at the appropriate time.
        settings[i] = settings[i].call(element);
      }
    }

    settings.rel = settings.rel || element.rel || $(element).data('rel') || 'nofollow';
    settings.href = settings.href || $(element).attr('href');
    settings.title = settings.title || element.title;

    if (typeof settings.href === "string") {
      settings.href = $.trim(settings.href);
    }
  }

  function trigger(event, callback) {
    $.event.trigger(event);
    if (callback) {
      callback.call(element);
    }
  }

  // Slideshow functionality

  function slideshow() {
    var
    timeOut,
      className = prefix + "Slideshow_",
      click = "click." + prefix,
      start,
      stop;

    if (settings.slideshow && $related[1]) {
      start = function() {
        $slideshow
          .html(settings.slideshowStop)
          .unbind(click)
          .bind(event_complete, function() {
            if (settings.loop || $related[index + 1]) {
              timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
            }
          })
          .bind(event_load, function() {
            clearTimeout(timeOut);
          })
          .one(click + ' ' + event_cleanup, stop);
        $box.removeClass(className + "off").addClass(className + "on");
        timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
      };

      stop = function() {
        clearTimeout(timeOut);
        $slideshow
          .html(settings.slideshowStart)
          .unbind([event_complete, event_load, event_cleanup, click].join(' '))
          .one(click, function() {
            publicMethod.next();
            start();
          });
        $box.removeClass(className + "on").addClass(className + "off");
      };

      if (settings.slideshowAuto) {
        start();
      } else {
        stop();
      }
    } else {
      $box.removeClass(className + "off " + className + "on");
    }
  }

  function launch(target) {
    if (!closing) {

      element = target;

      makeSettings();

      $related = $(element);

      index = 0;

      if (settings.rel !== 'nofollow') {
        $related = $('.' + boxElement).filter(function() {
          var data = $.data(this, colorbox),
            relRelated;

          if (data) {
            relRelated = $(this).data('rel') || data.rel || this.rel;
          }

          return (relRelated === settings.rel);
        });
        index = $related.index(element);

        // Check direct calls to ColorBox.
        if (index === -1) {
          $related = $related.add(element);
          index = $related.length - 1;
        }
      }

      if (!open) {
        open = active = true; // Prevents the page-change action from queuing up if the visitor holds down the left or right keys.

        $box.show();

        if (settings.returnFocus) {
          $(element).blur().one(event_closed, function() {
            $(this).focus();
          });
        }

        // +settings.opacity avoids a problem in IE when using non-zero-prefixed-string-values, like '.5'
        $overlay.css({
          "opacity": +settings.opacity,
          "cursor": settings.overlayClose ? "pointer" : "auto"
        }).show();

        // Opens inital empty ColorBox prior to content being loaded.
        settings.w = setSize(settings.initialWidth, 'x');
        settings.h = setSize(settings.initialHeight, 'y');
        publicMethod.position();

        if (isIE6) {
          $window.bind('resize.' + event_ie6 + ' scroll.' + event_ie6, function() {
            $overlay.css({
              width: $window.width(),
              height: $window.height(),
              top: $window.scrollTop(),
              left: $window.scrollLeft()
            });
          }).trigger('resize.' + event_ie6);
        }

        trigger(event_open, settings.onOpen);

        $groupControls.add($title).hide();

        $close.html(settings.close).show();
      }

      publicMethod.load(true);
    }
  }

  // ColorBox's markup needs to be added to the DOM prior to being called
  // so that the browser will go ahead and load the CSS background images.

  function appendHTML() {
    if (!$box && document.body) {
      init = false;

      $window = $(window);
      $box = $tag(div).attr({
        id: colorbox,
        'class': isIE ? prefix + (isIE6 ? 'IE6' : 'IE') : ''
      }).hide();
      $overlay = $tag(div, "Overlay", isIE6 ? 'position:absolute' : '').hide();
      $loadingOverlay = $tag(div, "LoadingOverlay").add($tag(div, "LoadingGraphic"));
      $wrap = $tag(div, "Wrapper");
      $content = $tag(div, "Content").append(
        $loaded = $tag(div, "LoadedContent", 'width:0; height:0; overflow:hidden'),
        $title = $tag(div, "Title"),
        $current = $tag(div, "Current"),
        $next = $tag(div, "Next"),
        $prev = $tag(div, "Previous"),
        $slideshow = $tag(div, "Slideshow").bind(event_open, slideshow),
        $close = $tag(div, "Close")
      );

      $wrap.append( // The 3x3 Grid that makes up ColorBox
        $tag(div).append(
          $tag(div, "TopLeft"),
          $topBorder = $tag(div, "TopCenter"),
          $tag(div, "TopRight")
        ),
        $tag(div, false, 'clear:left').append(
          $leftBorder = $tag(div, "MiddleLeft"),
          $content,
          $rightBorder = $tag(div, "MiddleRight")
        ),
        $tag(div, false, 'clear:left').append(
          $tag(div, "BottomLeft"),
          $bottomBorder = $tag(div, "BottomCenter"),
          $tag(div, "BottomRight")
        )
      ).find('div div').css({
        'float': 'left'
      });

      $loadingBay = $tag(div, false, 'position:absolute; width:9999px; visibility:hidden; display:none');

      $groupControls = $next.add($prev).add($current).add($slideshow);

      $(document.body).append($overlay, $box.append($wrap, $loadingBay));
    }
  }

  // Add ColorBox's event bindings

  function addBindings() {
    if ($box) {
      if (!init) {
        init = true;

        // Cache values needed for size calculations
        interfaceHeight = $topBorder.height() + $bottomBorder.height() + $content.outerHeight(true) - $content.height(); //Subtraction needed for IE6
        interfaceWidth = $leftBorder.width() + $rightBorder.width() + $content.outerWidth(true) - $content.width();
        loadedHeight = $loaded.outerHeight(true);
        loadedWidth = $loaded.outerWidth(true);

        // Setting padding to remove the need to do size conversions during the animation step.
        $box.css({
          "padding-bottom": interfaceHeight,
          "padding-right": interfaceWidth
        });

        // Anonymous functions here keep the public method from being cached, thereby allowing them to be redefined on the fly.
        $next.click(function() {
          publicMethod.next();
        });
        $prev.click(function() {
          publicMethod.prev();
        });
        $close.click(function() {
          publicMethod.close();
        });
        $overlay.click(function() {
          if (settings.overlayClose) {
            publicMethod.close();
          }
        });

        // Key Bindings
        $(document).bind('keydown.' + prefix, function(e) {
          var key = e.keyCode;
          if (open && settings.escKey && key === 27) {
            e.preventDefault();
            publicMethod.close();
          }
          if (open && settings.arrowKey && $related[1]) {
            if (key === 37) {
              e.preventDefault();
              $prev.click();
            } else if (key === 39) {
              e.preventDefault();
              $next.click();
            }
          }
        });

        $(document).delegate('.' + boxElement, 'click', function(e) {
          // ignore non-left-mouse-clicks and clicks modified with ctrl / command, shift, or alt.
          // See: http://jacklmoore.com/notes/click-events/
          if (!(e.which > 1 || e.shiftKey || e.altKey || e.metaKey)) {
            e.preventDefault();
            launch(this);
          }
        });
      }
      return true;
    }
    return false;
  }

  // Don't do anything if ColorBox already exists.
  if ($.colorbox) {
    return;
  }

  // Append the HTML when the DOM loads
  $(appendHTML);


  // ****************
  // PUBLIC FUNCTIONS
  // Usage format: $.fn.colorbox.close();
  // Usage from within an iframe: parent.$.fn.colorbox.close();
  // ****************

  publicMethod = $.fn[colorbox] = $[colorbox] = function(options, callback) {
    var $this = this;

    options = options || {};

    appendHTML();

    if (addBindings()) {
      if (!$this[0]) {
        if ($this.selector) { // if a selector was given and it didn't match any elements, go ahead and exit.
          return $this;
        }
        // if no selector was given (ie. $.colorbox()), create a temporary element to work with
        $this = $('<a/>');
        options.open = true; // assume an immediate open
      }

      if (callback) {
        options.onComplete = callback;
      }

      $this.each(function() {
        $.data(this, colorbox, $.extend({}, $.data(this, colorbox) || defaults, options));
      }).addClass(boxElement);

      if (($.isFunction(options.open) && options.open.call($this)) || options.open) {
        launch($this[0]);
      }
    }

    return $this;
  };

  publicMethod.position = function(speed, loadedCallback) {
    var
    css,
      top = 0,
      left = 0,
      offset = $box.offset(),
      scrollTop,
      scrollLeft;

    $window.unbind('resize.' + prefix);

    // remove the modal so that it doesn't influence the document width/height
    $box.css({
      top: -9e4,
      left: -9e4
    });

    scrollTop = $window.scrollTop();
    scrollLeft = $window.scrollLeft();

    if (settings.fixed && !isIE6) {
      offset.top -= scrollTop;
      offset.left -= scrollLeft;
      $box.css({
        position: 'fixed'
      });
    } else {
      top = scrollTop;
      left = scrollLeft;
      $box.css({
        position: 'absolute'
      });
    }

    // keeps the top and left positions within the browser's viewport.
    if (settings.right !== false) {
      left += Math.max($window.width() - settings.w - loadedWidth - interfaceWidth - setSize(settings.right, 'x'), 0);
    } else if (settings.left !== false) {
      left += setSize(settings.left, 'x');
    } else {
      left += Math.round(Math.max($window.width() - settings.w - loadedWidth - interfaceWidth, 0) / 2);
    }

    if (settings.bottom !== false) {
      top += Math.max($window.height() - settings.h - loadedHeight - interfaceHeight - setSize(settings.bottom, 'y'), 0);
    } else if (settings.top !== false) {
      top += setSize(settings.top, 'y');
    } else {
      top += Math.round(Math.max($window.height() - settings.h - loadedHeight - interfaceHeight, 0) / 2);
    }

    $box.css({
      top: offset.top,
      left: offset.left
    });

    // setting the speed to 0 to reduce the delay between same-sized content.
    speed = ($box.width() === settings.w + loadedWidth && $box.height() === settings.h + loadedHeight) ? 0 : speed || 0;

    // this gives the wrapper plenty of breathing room so it's floated contents can move around smoothly,
    // but it has to be shrank down around the size of div#colorbox when it's done.  If not,
    // it can invoke an obscure IE bug when using iframes.
    $wrap[0].style.width = $wrap[0].style.height = "9999px";

    function modalDimensions(that) {
      $topBorder[0].style.width = $bottomBorder[0].style.width = $content[0].style.width = that.style.width;
      $content[0].style.height = $leftBorder[0].style.height = $rightBorder[0].style.height = that.style.height;
    }

    css = {
      width: settings.w + loadedWidth,
      height: settings.h + loadedHeight,
      top: top,
      left: left
    };
    if (speed === 0) { // temporary workaround to side-step jQuery-UI 1.8 bug (http://bugs.jquery.com/ticket/12273)
      $box.css(css);
    }
    $box.dequeue().animate(css, {
      duration: speed,
      complete: function() {
        modalDimensions(this);

        active = false;

        // shrink the wrapper down to exactly the size of colorbox to avoid a bug in IE's iframe implementation.
        $wrap[0].style.width = (settings.w + loadedWidth + interfaceWidth) + "px";
        $wrap[0].style.height = (settings.h + loadedHeight + interfaceHeight) + "px";

        if (settings.reposition) {
          setTimeout(function() { // small delay before binding onresize due to an IE8 bug.
            $window.bind('resize.' + prefix, publicMethod.position);
          }, 1);
        }

        if (loadedCallback) {
          loadedCallback();
        }
      },
      step: function() {
        modalDimensions(this);
      }
    });
  };

  publicMethod.resize = function(options) {
    if (open) {
      options = options || {};

      if (options.width) {
        settings.w = setSize(options.width, 'x') - loadedWidth - interfaceWidth;
      }
      if (options.innerWidth) {
        settings.w = setSize(options.innerWidth, 'x');
      }
      $loaded.css({
        width: settings.w
      });

      if (options.height) {
        settings.h = setSize(options.height, 'y') - loadedHeight - interfaceHeight;
      }
      if (options.innerHeight) {
        settings.h = setSize(options.innerHeight, 'y');
      }
      if (!options.innerHeight && !options.height) {
        $loaded.css({
          height: "auto"
        });
        settings.h = $loaded.height();
      }
      $loaded.css({
        height: settings.h
      });

      publicMethod.position(settings.transition === "none" ? 0 : settings.speed);
    }
  };

  publicMethod.prep = function(object) {
    if (!open) {
      return;
    }

    var callback, speed = settings.transition === "none" ? 0 : settings.speed;

    $loaded.remove();
    $loaded = $tag(div, 'LoadedContent').append(object);

    function getWidth() {
      settings.w = settings.w || $loaded.width();
      settings.w = settings.mw && settings.mw < settings.w ? settings.mw : settings.w;
      return settings.w;
    }

    function getHeight() {
      settings.h = settings.h || $loaded.height();
      settings.h = settings.mh && settings.mh < settings.h ? settings.mh : settings.h;
      return settings.h;
    }

    $loaded.hide()
      .appendTo($loadingBay.show()) // content has to be appended to the DOM for accurate size calculations.
    .css({
      width: getWidth(),
      overflow: settings.scrolling ? 'auto' : 'hidden'
    })
      .css({
        height: getHeight()
      }) // sets the height independently from the width in case the new width influences the value of height.
    .prependTo($content);

    $loadingBay.hide();

    // floating the IMG removes the bottom line-height and fixed a problem where IE miscalculates the width of the parent element as 100% of the document width.
    //$(photo).css({'float': 'none', marginLeft: 'auto', marginRight: 'auto'});

    $(photo).css({
      'float': 'none'
    });

    // Hides SELECT elements in IE6 because they would otherwise sit on top of the overlay.
    if (isIE6) {
      $('select').not($box.find('select')).filter(function() {
        return this.style.visibility !== 'hidden';
      }).css({
        'visibility': 'hidden'
      }).one(event_cleanup, function() {
        this.style.visibility = 'inherit';
      });
    }

    callback = function() {
      var preload,
        i,
        total = $related.length,
        iframe,
        frameBorder = 'frameBorder',
        allowTransparency = 'allowTransparency',
        complete,
        src,
        img,
        data;

      if (!open) {
        return;
      }

      function removeFilter() {
        if (isIE) {
          $box[0].style.removeAttribute('filter');
        }
      }

      complete = function() {
        clearTimeout(loadingTimer);
        // Detaching forces Andriod stock browser to redraw the area underneat the loading overlay.  Hiding alone isn't enough.
        $loadingOverlay.detach().hide();
        trigger(event_complete, settings.onComplete);
      };

      if (isIE) {
        //This fadeIn helps the bicubic resampling to kick-in.
        if (photo) {
          $loaded.fadeIn(100);
        }
      }

      $title.html(settings.title).add($loaded).show();

      if (total > 1) { // handle grouping
        if (typeof settings.current === "string") {
          $current.html(settings.current.replace('{current}', index + 1).replace('{total}', total)).show();
        }

        $next[(settings.loop || index < total - 1) ? "show" : "hide"]().html(settings.next);
        $prev[(settings.loop || index) ? "show" : "hide"]().html(settings.previous);

        if (settings.slideshow) {
          $slideshow.show();
        }

        // Preloads images within a rel group
        if (settings.preloading) {
          preload = [
            getIndex(-1),
            getIndex(1)
          ];
          while (i = $related[preload.pop()]) {
            data = $.data(i, colorbox);

            if (data && data.href) {
              src = data.href;
              if ($.isFunction(src)) {
                src = src.call(i);
              }
            } else {
              src = i.href;
            }

            if (isImage(src)) {
              img = new Image();
              img.src = src;
            }
          }
        }
      } else {
        $groupControls.hide();
      }

      if (settings.iframe) {
        iframe = $tag('iframe')[0];

        if (frameBorder in iframe) {
          iframe[frameBorder] = 0;
        }

        if (allowTransparency in iframe) {
          iframe[allowTransparency] = "true";
        }

        if (!settings.scrolling) {
          iframe.scrolling = "no";
        }

        $(iframe)
          .attr({
            src: settings.href,
            name: (new Date()).getTime(), // give the iframe a unique name to prevent caching
            'class': prefix + 'Iframe',
            allowFullScreen: true, // allow HTML5 video to go fullscreen
            webkitAllowFullScreen: true,
            mozallowfullscreen: true
          })
          .one('load', complete)
          .one(event_purge, function() {
            iframe.src = "//about:blank";
          })
          .appendTo($loaded);

        if (settings.fastIframe) {
          $(iframe).trigger('load');
        }
      } else {
        complete();
      }

      if (settings.transition === 'fade') {
        $box.fadeTo(speed, 1, removeFilter);
      } else {
        removeFilter();
      }
    };

    if (settings.transition === 'fade') {
      $box.fadeTo(speed, 0, function() {
        publicMethod.position(0, callback);
      });
    } else {
      publicMethod.position(speed, callback);
    }
  };

  publicMethod.load = function(launched) {
    var href, setResize, prep = publicMethod.prep;

    active = true;

    photo = false;

    element = $related[index];

    if (!launched) {
      makeSettings();
    }

    trigger(event_purge);

    trigger(event_load, settings.onLoad);

    settings.h = settings.height ?
      setSize(settings.height, 'y') - loadedHeight - interfaceHeight :
      settings.innerHeight && setSize(settings.innerHeight, 'y');

    settings.w = settings.width ?
      setSize(settings.width, 'x') - loadedWidth - interfaceWidth :
      settings.innerWidth && setSize(settings.innerWidth, 'x');

    // Sets the minimum dimensions for use in image scaling
    settings.mw = settings.w;
    settings.mh = settings.h;

    // Re-evaluate the minimum width and height based on maxWidth and maxHeight values.
    // If the width or height exceed the maxWidth or maxHeight, use the maximum values instead.
    if (settings.maxWidth) {
      settings.mw = setSize(settings.maxWidth, 'x') - loadedWidth - interfaceWidth;
      settings.mw = settings.w && settings.w < settings.mw ? settings.w : settings.mw;
    }
    if (settings.maxHeight) {
      settings.mh = setSize(settings.maxHeight, 'y') - loadedHeight - interfaceHeight;
      settings.mh = settings.h && settings.h < settings.mh ? settings.h : settings.mh;
    }

    href = settings.href;

    loadingTimer = setTimeout(function() {
      $loadingOverlay.show().appendTo($content);
    }, 100);

    if (settings.inline) {
      // Inserts an empty placeholder where inline content is being pulled from.
      // An event is bound to put inline content back when ColorBox closes or loads new content.
      $tag(div).hide().insertBefore($(href)[0]).one(event_purge, function() {
        $(this).replaceWith($loaded.children());
      });
      prep($(href));
    } else if (settings.iframe) {
      // IFrame element won't be added to the DOM until it is ready to be displayed,
      // to avoid problems with DOM-ready JS that might be trying to run in that iframe.
      prep(" ");
    } else if (settings.html) {
      prep(settings.html);
    } else if (isImage(href)) {
      $(photo = new Image())
        .addClass(prefix + 'Photo')
        .bind('error', function() {
          settings.title = false;
          prep($tag(div, 'Error').html(settings.imgError));
        })
        .load(function() {
          var percent;
          photo.onload = null; //stops animated gifs from firing the onload repeatedly.

          if (settings.scalePhotos) {
            setResize = function() {
              photo.height -= photo.height * percent;
              photo.width -= photo.width * percent;
            };
            if (settings.mw && photo.width > settings.mw) {
              percent = (photo.width - settings.mw) / photo.width;
              setResize();
            }
            if (settings.mh && photo.height > settings.mh) {
              percent = (photo.height - settings.mh) / photo.height;
              setResize();
            }
          }

          if (settings.h) {
            photo.style.marginTop = Math.max(settings.h - photo.height, 0) / 2 + 'px';
          }

          if ($related[1] && (settings.loop || $related[index + 1])) {
            photo.style.cursor = 'pointer';
            photo.onclick = function() {
              publicMethod.next();
            };
          }

          if (isIE) {
            photo.style.msInterpolationMode = 'bicubic';
          }

          setTimeout(function() { // A pause because Chrome will sometimes report a 0 by 0 size otherwise.
            prep(photo);
          }, 1);
        });

      setTimeout(function() { // A pause because Opera 10.6+ will sometimes not run the onload function otherwise.
        photo.src = href;
      }, 1);
    } else if (href) {
      $loadingBay.load(href, settings.data, function(data, status) {
        prep(status === 'error' ? $tag(div, 'Error').html(settings.xhrError) : $(this).contents());
      });
    }
  };

  // Navigates to the next page/image in a set.
  publicMethod.next = function() {
    if (!active && $related[1] && (settings.loop || $related[index + 1])) {
      index = getIndex(1);
      publicMethod.load();
    }
  };

  publicMethod.prev = function() {
    if (!active && $related[1] && (settings.loop || index)) {
      index = getIndex(-1);
      publicMethod.load();
    }
  };

  // Note: to use this within an iframe use the following format: parent.$.fn.colorbox.close();
  publicMethod.close = function() {
    if (open && !closing) {

      closing = true;

      open = false;

      trigger(event_cleanup, settings.onCleanup);

      $window.unbind('.' + prefix + ' .' + event_ie6);

      $overlay.fadeTo(200, 0);

      $box.stop().fadeTo(300, 0, function() {

        $box.add($overlay).css({
          'opacity': 1,
          cursor: 'auto'
        }).hide();

        trigger(event_purge);

        $loaded.remove();

        setTimeout(function() {
          closing = false;
          trigger(event_closed, settings.onClosed);
        }, 1);
      });
    }
  };

  // Removes changes ColorBox made to the document, but does not remove the plugin
  // from jQuery.
  publicMethod.remove = function() {
    $([]).add($box).add($overlay).remove();
    $box = null;
    $('.' + boxElement)
      .removeData(colorbox)
      .removeClass(boxElement);

    $(document).undelegate('.' + boxElement);
  };

  // A method for fetching the current element ColorBox is referencing.
  // returns a jQuery object.
  publicMethod.element = function() {
    return $(element);
  };

  publicMethod.settings = defaults;

}(jQuery, document, window));
ready
Fancybox
/*!
 * fancyBox - jQuery Plugin
 * version: 2.1.3 (Tue, 23 Oct 2012)
 * @requires jQuery v1.6 or later
 *
 * Examples at http://fancyapps.com/fancybox/
 * License: www.fancyapps.com/fancybox/#license
 *
 * Copyright 2012 Janis Skarnelis - janis@fancyapps.com
 *
 */

(function(window, document, $, undefined) {
  "use strict";

  var W = $(window),
    D = $(document),
    F = $.fancybox = function() {
      F.open.apply(this, arguments);
    },
    didUpdate = null,
    isTouch = document.createTouch !== undefined,

    isQuery = function(obj) {
      return obj && obj.hasOwnProperty && obj instanceof $;
    },
    isString = function(str) {
      return str && $.type(str) === "string";
    },
    isPercentage = function(str) {
      return isString(str) && str.indexOf('%') > 0;
    },
    isScrollable = function(el) {
      return (el && !(el.style.overflow && el.style.overflow === 'hidden') && ((el.clientWidth && el.scrollWidth > el.clientWidth) || (el.clientHeight && el.scrollHeight > el.clientHeight)));
    },
    getScalar = function(orig, dim) {
      var value = parseInt(orig, 10) || 0;

      if (dim && isPercentage(orig)) {
        value = F.getViewport()[dim] / 100 * value;
      }

      return Math.ceil(value);
    },
    getValue = function(value, dim) {
      return getScalar(value, dim) + 'px';
    };

  $.extend(F, {
    // The current version of fancyBox
    version: '2.1.3',

    defaults: {
      padding: 15,
      margin: 20,

      width: 800,
      height: 600,
      minWidth: 100,
      minHeight: 100,
      maxWidth: 9999,
      maxHeight: 9999,

      autoSize: true,
      autoHeight: false,
      autoWidth: false,

      autoResize: true,
      autoCenter: !isTouch,
      fitToView: true,
      aspectRatio: false,
      topRatio: 0.5,
      leftRatio: 0.5,

      scrolling: 'auto', // 'auto', 'yes' or 'no'
      wrapCSS: '',

      arrows: true,
      closeBtn: true,
      closeClick: false,
      nextClick: false,
      mouseWheel: true,
      autoPlay: false,
      playSpeed: 3000,
      preload: 3,
      modal: false,
      loop: true,

      ajax: {
        dataType: 'html',
        headers: {
          'X-fancyBox': true
        }
      },
      iframe: {
        scrolling: 'auto',
        preload: true
      },
      swf: {
        wmode: 'transparent',
        allowfullscreen: 'true',
        allowscriptaccess: 'always'
      },

      keys: {
        next: {
          13: 'left', // enter
          34: 'up', // page down
          39: 'left', // right arrow
          40: 'up' // down arrow
        },
        prev: {
          8: 'right', // backspace
          33: 'down', // page up
          37: 'right', // left arrow
          38: 'down' // up arrow
        },
        close: [27], // escape key
        play: [32], // space - start/stop slideshow
        toggle: [70] // letter "f" - toggle fullscreen
      },

      direction: {
        next: 'left',
        prev: 'right'
      },

      scrollOutside: true,

      // Override some properties
      index: 0,
      type: null,
      href: null,
      content: null,
      title: null,

      // HTML templates
      tpl: {
        wrap: '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>',
        image: '<img class="fancybox-image" src="{href}" alt="" />',
        iframe: '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen' + ($.browser.msie ? ' allowtransparency="true"' : '') + '></iframe>',
        error: '<p class="fancybox-error">The requested content cannot be loaded.<br/>Please try again later.</p>',
        closeBtn: '<a title="Close" class="fancybox-item fancybox-close" href="javascript:;"></a>',
        next: '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
        prev: '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>'
      },

      // Properties for each animation type
      // Opening fancyBox
      openEffect: 'fade', // 'elastic', 'fade' or 'none'
      openSpeed: 250,
      openEasing: 'swing',
      openOpacity: true,
      openMethod: 'zoomIn',

      // Closing fancyBox
      closeEffect: 'fade', // 'elastic', 'fade' or 'none'
      closeSpeed: 250,
      closeEasing: 'swing',
      closeOpacity: true,
      closeMethod: 'zoomOut',

      // Changing next gallery item
      nextEffect: 'elastic', // 'elastic', 'fade' or 'none'
      nextSpeed: 250,
      nextEasing: 'swing',
      nextMethod: 'changeIn',

      // Changing previous gallery item
      prevEffect: 'elastic', // 'elastic', 'fade' or 'none'
      prevSpeed: 250,
      prevEasing: 'swing',
      prevMethod: 'changeOut',

      // Enable default helpers
      helpers: {
        overlay: true,
        title: true
      },

      // Callbacks
      onCancel: $.noop, // If canceling
      beforeLoad: $.noop, // Before loading
      afterLoad: $.noop, // After loading
      beforeShow: $.noop, // Before changing in current item
      afterShow: $.noop, // After opening
      beforeChange: $.noop, // Before changing gallery item
      beforeClose: $.noop, // Before closing
      afterClose: $.noop // After closing
    },

    //Current state
    group: {}, // Selected group
    opts: {}, // Group options
    previous: null, // Previous element
    coming: null, // Element being loaded
    current: null, // Currently loaded element
    isActive: false, // Is activated
    isOpen: false, // Is currently open
    isOpened: false, // Have been fully opened at least once

    wrap: null,
    skin: null,
    outer: null,
    inner: null,

    player: {
      timer: null,
      isActive: false
    },

    // Loaders
    ajaxLoad: null,
    imgPreload: null,

    // Some collections
    transitions: {},
    helpers: {},

    /*
     *  Static methods
     */

    open: function(group, opts) {
      if (!group) {
        return;
      }

      if (!$.isPlainObject(opts)) {
        opts = {};
      }

      // Close if already active
      if (false === F.close(true)) {
        return;
      }

      // Normalize group
      if (!$.isArray(group)) {
        group = isQuery(group) ? $(group).get() : [group];
      }

      // Recheck if the type of each element is `object` and set content type (image, ajax, etc)
      $.each(group, function(i, element) {
        var obj = {},
          href,
          title,
          content,
          type,
          rez,
          hrefParts,
          selector;

        if ($.type(element) === "object") {
          // Check if is DOM element
          if (element.nodeType) {
            element = $(element);
          }

          if (isQuery(element)) {
            obj = {
              href: element.data('fancybox-href') || element.attr('href'),
              title: element.data('fancybox-title') || element.attr('title'),
              isDom: true,
              element: element
            };

            if ($.metadata) {
              $.extend(true, obj, element.metadata());
            }

          } else {
            obj = element;
          }
        }

        href = opts.href || obj.href || (isString(element) ? element : null);
        title = opts.title !== undefined ? opts.title : obj.title || '';

        content = opts.content || obj.content;
        type = content ? 'html' : (opts.type || obj.type);

        if (!type && obj.isDom) {
          type = element.data('fancybox-type');

          if (!type) {
            rez = element.prop('class').match(/fancybox\.(\w+)/);
            type = rez ? rez[1] : null;
          }
        }

        if (isString(href)) {
          // Try to guess the content type
          if (!type) {
            if (F.isImage(href)) {
              type = 'image';

            } else if (F.isSWF(href)) {
              type = 'swf';

            } else if (href.charAt(0) === '#') {
              type = 'inline';

            } else if (isString(element)) {
              type = 'html';
              content = element;
            }
          }

          // Split url into two pieces with source url and content selector, e.g,
          // "/mypage.html #my_id" will load "/mypage.html" and display element having id "my_id"
          if (type === 'ajax') {
            hrefParts = href.split(/\s+/, 2);
            href = hrefParts.shift();
            selector = hrefParts.shift();
          }
        }

        if (!content) {
          if (type === 'inline') {
            if (href) {
              content = $(isString(href) ? href.replace(/.*(?=#[^\s]+$)/, '') : href); //strip for ie7

            } else if (obj.isDom) {
              content = element;
            }

          } else if (type === 'html') {
            content = href;

          } else if (!type && !href && obj.isDom) {
            type = 'inline';
            content = element;
          }
        }

        $.extend(obj, {
          href: href,
          type: type,
          content: content,
          title: title,
          selector: selector
        });

        group[i] = obj;
      });

      // Extend the defaults
      F.opts = $.extend(true, {}, F.defaults, opts);

      // All options are merged recursive except keys
      if (opts.keys !== undefined) {
        F.opts.keys = opts.keys ? $.extend({}, F.defaults.keys, opts.keys) : false;
      }

      F.group = group;

      return F._start(F.opts.index);
    },

    // Cancel image loading or abort ajax request
    cancel: function() {
      var coming = F.coming;

      if (!coming || false === F.trigger('onCancel')) {
        return;
      }

      F.hideLoading();

      if (F.ajaxLoad) {
        F.ajaxLoad.abort();
      }

      F.ajaxLoad = null;

      if (F.imgPreload) {
        F.imgPreload.onload = F.imgPreload.onerror = null;
      }

      if (coming.wrap) {
        coming.wrap.stop(true, true).trigger('onReset').remove();
      }

      F.coming = null;

      // If the first item has been canceled, then clear everything
      if (!F.current) {
        F._afterZoomOut(coming);
      }
    },

    // Start closing animation if is open; remove immediately if opening/closing
    close: function(event) {
      F.cancel();

      if (false === F.trigger('beforeClose')) {
        return;
      }

      F.unbindEvents();

      if (!F.isActive) {
        return;
      }

      if (!F.isOpen || event === true) {
        $('.fancybox-wrap').stop(true).trigger('onReset').remove();

        F._afterZoomOut();

      } else {
        F.isOpen = F.isOpened = false;
        F.isClosing = true;

        $('.fancybox-item, .fancybox-nav').remove();

        F.wrap.stop(true, true).removeClass('fancybox-opened');

        F.transitions[F.current.closeMethod]();
      }
    },

    // Manage slideshow:
    //   $.fancybox.play(); - toggle slideshow
    //   $.fancybox.play( true ); - start
    //   $.fancybox.play( false ); - stop
    play: function(action) {
      var clear = function() {
        clearTimeout(F.player.timer);
      },
        set = function() {
          clear();

          if (F.current && F.player.isActive) {
            F.player.timer = setTimeout(F.next, F.current.playSpeed);
          }
        },
        stop = function() {
          clear();

          $('body').unbind('.player');

          F.player.isActive = false;

          F.trigger('onPlayEnd');
        },
        start = function() {
          if (F.current && (F.current.loop || F.current.index < F.group.length - 1)) {
            F.player.isActive = true;

            $('body').bind({
              'afterShow.player onUpdate.player': set,
              'onCancel.player beforeClose.player': stop,
              'beforeLoad.player': clear
            });

            set();

            F.trigger('onPlayStart');
          }
        };

      if (action === true || (!F.player.isActive && action !== false)) {
        start();
      } else {
        stop();
      }
    },

    // Navigate to next gallery item
    next: function(direction) {
      var current = F.current;

      if (current) {
        if (!isString(direction)) {
          direction = current.direction.next;
        }

        F.jumpto(current.index + 1, direction, 'next');
      }
    },

    // Navigate to previous gallery item
    prev: function(direction) {
      var current = F.current;

      if (current) {
        if (!isString(direction)) {
          direction = current.direction.prev;
        }

        F.jumpto(current.index - 1, direction, 'prev');
      }
    },

    // Navigate to gallery item by index
    jumpto: function(index, direction, router) {
      var current = F.current;

      if (!current) {
        return;
      }

      index = getScalar(index);

      F.direction = direction || current.direction[(index >= current.index ? 'next' : 'prev')];
      F.router = router || 'jumpto';

      if (current.loop) {
        if (index < 0) {
          index = current.group.length + (index % current.group.length);
        }

        index = index % current.group.length;
      }

      if (current.group[index] !== undefined) {
        F.cancel();

        F._start(index);
      }
    },

    // Center inside viewport and toggle position type to fixed or absolute if needed
    reposition: function(e, onlyAbsolute) {
      var current = F.current,
        wrap = current ? current.wrap : null,
        pos;

      if (wrap) {
        pos = F._getPosition(onlyAbsolute);

        if (e && e.type === 'scroll') {
          delete pos.position;

          wrap.stop(true, true).animate(pos, 200);

        } else {
          wrap.css(pos);

          current.pos = $.extend({}, current.dim, pos);
        }
      }
    },

    update: function(e) {
      var type = (e && e.type),
        anyway = !type || type === 'orientationchange';

      if (anyway) {
        clearTimeout(didUpdate);

        didUpdate = null;
      }

      if (!F.isOpen || didUpdate) {
        return;
      }

      didUpdate = setTimeout(function() {
        var current = F.current;

        if (!current || F.isClosing) {
          return;
        }

        F.wrap.removeClass('fancybox-tmp');

        if (anyway || type === 'load' || (type === 'resize' && current.autoResize)) {
          F._setDimension();
        }

        if (!(type === 'scroll' && current.canShrink)) {
          F.reposition(e);
        }

        F.trigger('onUpdate');

        didUpdate = null;

      }, (anyway && !isTouch ? 0 : 300));
    },

    // Shrink content to fit inside viewport or restore if resized
    toggle: function(action) {
      if (F.isOpen) {
        F.current.fitToView = $.type(action) === "boolean" ? action : !F.current.fitToView;

        // Help browser to restore document dimensions
        if (isTouch) {
          F.wrap.removeAttr('style').addClass('fancybox-tmp');

          F.trigger('onUpdate');
        }

        F.update();
      }
    },

    hideLoading: function() {
      D.unbind('.loading');

      $('#fancybox-loading').remove();
    },

    showLoading: function() {
      var el, viewport;

      F.hideLoading();

      el = $('<div id="fancybox-loading"><div></div></div>').click(F.cancel).appendTo('body');

      // If user will press the escape-button, the request will be canceled
      D.bind('keydown.loading', function(e) {
        if ((e.which || e.keyCode) === 27) {
          e.preventDefault();

          F.cancel();
        }
      });

      if (!F.defaults.fixed) {
        viewport = F.getViewport();

        el.css({
          position: 'absolute',
          top: (viewport.h * 0.5) + viewport.y,
          left: (viewport.w * 0.5) + viewport.x
        });
      }
    },

    getViewport: function() {
      var locked = (F.current && F.current.locked) || false,
        rez = {
          x: W.scrollLeft(),
          y: W.scrollTop()
        };

      if (locked) {
        rez.w = locked[0].clientWidth;
        rez.h = locked[0].clientHeight;

      } else {
        // See http://bugs.jquery.com/ticket/6724
        rez.w = isTouch && window.innerWidth ? window.innerWidth : W.width();
        rez.h = isTouch && window.innerHeight ? window.innerHeight : W.height();
      }

      return rez;
    },

    // Unbind the keyboard / clicking actions
    unbindEvents: function() {
      if (F.wrap && isQuery(F.wrap)) {
        F.wrap.unbind('.fb');
      }

      D.unbind('.fb');
      W.unbind('.fb');
    },

    bindEvents: function() {
      var current = F.current,
        keys;

      if (!current) {
        return;
      }

      // Changing document height on iOS devices triggers a 'resize' event,
      // that can change document height... repeating infinitely
      W.bind('orientationchange.fb' + (isTouch ? '' : ' resize.fb') + (current.autoCenter && !current.locked ? ' scroll.fb' : ''), F.update);

      keys = current.keys;

      if (keys) {
        D.bind('keydown.fb', function(e) {
          var code = e.which || e.keyCode,
            target = e.target || e.srcElement;

          // Skip esc key if loading, because showLoading will cancel preloading
          if (code === 27 && F.coming) {
            return false;
          }

          // Ignore key combinations and key events within form elements
          if (!e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey && !(target && (target.type || $(target).is('[contenteditable]')))) {
            $.each(keys, function(i, val) {
              if (current.group.length > 1 && val[code] !== undefined) {
                F[i](val[code]);

                e.preventDefault();
                return false;
              }

              if ($.inArray(code, val) > -1) {
                F[i]();

                e.preventDefault();
                return false;
              }
            });
          }
        });
      }

      if ($.fn.mousewheel && current.mouseWheel) {
        F.wrap.bind('mousewheel.fb', function(e, delta, deltaX, deltaY) {
          var target = e.target || null,
            parent = $(target),
            canScroll = false;

          while (parent.length) {
            if (canScroll || parent.is('.fancybox-skin') || parent.is('.fancybox-wrap')) {
              break;
            }

            canScroll = isScrollable(parent[0]);
            parent = $(parent).parent();
          }

          if (delta !== 0 && !canScroll) {
            if (F.group.length > 1 && !current.canShrink) {
              if (deltaY > 0 || deltaX > 0) {
                F.prev(deltaY > 0 ? 'down' : 'left');

              } else if (deltaY < 0 || deltaX < 0) {
                F.next(deltaY < 0 ? 'up' : 'right');
              }

              e.preventDefault();
            }
          }
        });
      }
    },

    trigger: function(event, o) {
      var ret, obj = o || F.coming || F.current;

      if (!obj) {
        return;
      }

      if ($.isFunction(obj[event])) {
        ret = obj[event].apply(obj, Array.prototype.slice.call(arguments, 1));
      }

      if (ret === false) {
        return false;
      }

      if (obj.helpers) {
        $.each(obj.helpers, function(helper, opts) {
          if (opts && F.helpers[helper] && $.isFunction(F.helpers[helper][event])) {
            opts = $.extend(true, {}, F.helpers[helper].defaults, opts);

            F.helpers[helper][event](opts, obj);
          }
        });
      }

      $.event.trigger(event + '.fb');
    },

    isImage: function(str) {
      return isString(str) && str.match(/(^data:image\/.*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp)((\?|#).*)?$)/i);
    },

    isSWF: function(str) {
      return isString(str) && str.match(/\.(swf)((\?|#).*)?$/i);
    },

    _start: function(index) {
      var coming = {},
        obj,
        href,
        type,
        margin,
        padding;

      index = getScalar(index);
      obj = F.group[index] || null;

      if (!obj) {
        return false;
      }

      coming = $.extend(true, {}, F.opts, obj);

      // Convert margin and padding properties to array - top, right, bottom, left
      margin = coming.margin;
      padding = coming.padding;

      if ($.type(margin) === 'number') {
        coming.margin = [margin, margin, margin, margin];
      }

      if ($.type(padding) === 'number') {
        coming.padding = [padding, padding, padding, padding];
      }

      // 'modal' propery is just a shortcut
      if (coming.modal) {
        $.extend(true, coming, {
          closeBtn: false,
          closeClick: false,
          nextClick: false,
          arrows: false,
          mouseWheel: false,
          keys: null,
          helpers: {
            overlay: {
              closeClick: false
            }
          }
        });
      }

      // 'autoSize' property is a shortcut, too
      if (coming.autoSize) {
        coming.autoWidth = coming.autoHeight = true;
      }

      if (coming.width === 'auto') {
        coming.autoWidth = true;
      }

      if (coming.height === 'auto') {
        coming.autoHeight = true;
      }

      /*
       * Add reference to the group, so it`s possible to access from callbacks, example:
       * afterLoad : function() {
       *     this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
       * }
       */

      coming.group = F.group;
      coming.index = index;

      // Give a chance for callback or helpers to update coming item (type, title, etc)
      F.coming = coming;

      if (false === F.trigger('beforeLoad')) {
        F.coming = null;

        return;
      }

      type = coming.type;
      href = coming.href;

      if (!type) {
        F.coming = null;

        //If we can not determine content type then drop silently or display next/prev item if looping through gallery
        if (F.current && F.router && F.router !== 'jumpto') {
          F.current.index = index;

          return F[F.router](F.direction);
        }

        return false;
      }

      F.isActive = true;

      if (type === 'image' || type === 'swf') {
        coming.autoHeight = coming.autoWidth = false;
        coming.scrolling = 'visible';
      }

      if (type === 'image') {
        coming.aspectRatio = true;
      }

      if (type === 'iframe' && isTouch) {
        coming.scrolling = 'scroll';
      }

      // Build the neccessary markup
      coming.wrap = $(coming.tpl.wrap).addClass('fancybox-' + (isTouch ? 'mobile' : 'desktop') + ' fancybox-type-' + type + ' fancybox-tmp ' + coming.wrapCSS).appendTo(coming.parent || 'body');

      $.extend(coming, {
        skin: $('.fancybox-skin', coming.wrap),
        outer: $('.fancybox-outer', coming.wrap),
        inner: $('.fancybox-inner', coming.wrap)
      });

      $.each(["Top", "Right", "Bottom", "Left"], function(i, v) {
        coming.skin.css('padding' + v, getValue(coming.padding[i]));
      });

      F.trigger('onReady');

      // Check before try to load; 'inline' and 'html' types need content, others - href
      if (type === 'inline' || type === 'html') {
        if (!coming.content || !coming.content.length) {
          return F._error('content');
        }

      } else if (!href) {
        return F._error('href');
      }

      if (type === 'image') {
        F._loadImage();

      } else if (type === 'ajax') {
        F._loadAjax();

      } else if (type === 'iframe') {
        F._loadIframe();

      } else {
        F._afterLoad();
      }
    },

    _error: function(type) {
      $.extend(F.coming, {
        type: 'html',
        autoWidth: true,
        autoHeight: true,
        minWidth: 0,
        minHeight: 0,
        scrolling: 'no',
        hasError: type,
        content: F.coming.tpl.error
      });

      F._afterLoad();
    },

    _loadImage: function() {
      // Reset preload image so it is later possible to check "complete" property
      var img = F.imgPreload = new Image();

      img.onload = function() {
        this.onload = this.onerror = null;

        F.coming.width = this.width;
        F.coming.height = this.height;

        F._afterLoad();
      };

      img.onerror = function() {
        this.onload = this.onerror = null;

        F._error('image');
      };

      img.src = F.coming.href;

      if (img.complete !== true) {
        F.showLoading();
      }
    },

    _loadAjax: function() {
      var coming = F.coming;

      F.showLoading();

      F.ajaxLoad = $.ajax($.extend({}, coming.ajax, {
        url: coming.href,
        error: function(jqXHR, textStatus) {
          if (F.coming && textStatus !== 'abort') {
            F._error('ajax', jqXHR);

          } else {
            F.hideLoading();
          }
        },
        success: function(data, textStatus) {
          if (textStatus === 'success') {
            coming.content = data;

            F._afterLoad();
          }
        }
      }));
    },

    _loadIframe: function() {
      var coming = F.coming,
        iframe = $(coming.tpl.iframe.replace(/\{rnd\}/g, new Date().getTime()))
          .attr('scrolling', isTouch ? 'auto' : coming.iframe.scrolling)
          .attr('src', coming.href);

      // This helps IE
      $(coming.wrap).bind('onReset', function() {
        try {
          $(this).find('iframe').hide().attr('src', '//about:blank').end().empty();
        } catch (e) {}
      });

      if (coming.iframe.preload) {
        F.showLoading();

        iframe.one('load', function() {
          $(this).data('ready', 1);

          // iOS will lose scrolling if we resize
          if (!isTouch) {
            $(this).bind('load.fb', F.update);
          }

          // Without this trick:
          //   - iframe won't scroll on iOS devices
          //   - IE7 sometimes displays empty iframe
          $(this).parents('.fancybox-wrap').width('100%').removeClass('fancybox-tmp').show();

          F._afterLoad();
        });
      }

      coming.content = iframe.appendTo(coming.inner);

      if (!coming.iframe.preload) {
        F._afterLoad();
      }
    },

    _preloadImages: function() {
      var group = F.group,
        current = F.current,
        len = group.length,
        cnt = current.preload ? Math.min(current.preload, len - 1) : 0,
        item,
        i;

      for (i = 1; i <= cnt; i += 1) {
        item = group[(current.index + i) % len];

        if (item.type === 'image' && item.href) {
          new Image().src = item.href;
        }
      }
    },

    _afterLoad: function() {
      var coming = F.coming,
        previous = F.current,
        placeholder = 'fancybox-placeholder',
        current,
        content,
        type,
        scrolling,
        href,
        embed;

      F.hideLoading();

      if (!coming || F.isActive === false) {
        return;
      }

      if (false === F.trigger('afterLoad', coming, previous)) {
        coming.wrap.stop(true).trigger('onReset').remove();

        F.coming = null;

        return;
      }

      if (previous) {
        F.trigger('beforeChange', previous);

        previous.wrap.stop(true).removeClass('fancybox-opened')
          .find('.fancybox-item, .fancybox-nav')
          .remove();
      }

      F.unbindEvents();

      current = coming;
      content = coming.content;
      type = coming.type;
      scrolling = coming.scrolling;

      $.extend(F, {
        wrap: current.wrap,
        skin: current.skin,
        outer: current.outer,
        inner: current.inner,
        current: current,
        previous: previous
      });

      href = current.href;

      switch (type) {
        case 'inline':
        case 'ajax':
        case 'html':
          if (current.selector) {
            content = $('<div>').html(content).find(current.selector);

          } else if (isQuery(content)) {
            if (!content.data(placeholder)) {
              content.data(placeholder, $('<div class="' + placeholder + '"></div>').insertAfter(content).hide());
            }

            content = content.show().detach();

            current.wrap.bind('onReset', function() {
              if ($(this).find(content).length) {
                content.hide().replaceAll(content.data(placeholder)).data(placeholder, false);
              }
            });
          }
          break;

        case 'image':
          content = current.tpl.image.replace('{href}', href);
          break;

        case 'swf':
          content = '<object id="fancybox-swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%"><param name="movie" value="' + href + '"></param>';
          embed = '';

          $.each(current.swf, function(name, val) {
            content += '<param name="' + name + '" value="' + val + '"></param>';
            embed += ' ' + name + '="' + val + '"';
          });

          content += '<embed src="' + href + '" type="application/x-shockwave-flash" width="100%" height="100%"' + embed + '></embed></object>';
          break;
      }

      if (!(isQuery(content) && content.parent().is(current.inner))) {
        current.inner.append(content);
      }

      // Give a chance for helpers or callbacks to update elements
      F.trigger('beforeShow');

      // Set scrolling before calculating dimensions
      current.inner.css('overflow', scrolling === 'yes' ? 'scroll' : (scrolling === 'no' ? 'hidden' : scrolling));

      // Set initial dimensions and start position
      F._setDimension();

      F.reposition();

      F.isOpen = false;
      F.coming = null;

      F.bindEvents();

      if (!F.isOpened) {
        $('.fancybox-wrap').not(current.wrap).stop(true).trigger('onReset').remove();

      } else if (previous.prevMethod) {
        F.transitions[previous.prevMethod]();
      }

      F.transitions[F.isOpened ? current.nextMethod : current.openMethod]();

      F._preloadImages();
    },

    _setDimension: function() {
      var viewport = F.getViewport(),
        steps = 0,
        canShrink = false,
        canExpand = false,
        wrap = F.wrap,
        skin = F.skin,
        inner = F.inner,
        current = F.current,
        width = current.width,
        height = current.height,
        minWidth = current.minWidth,
        minHeight = current.minHeight,
        maxWidth = current.maxWidth,
        maxHeight = current.maxHeight,
        scrolling = current.scrolling,
        scrollOut = current.scrollOutside ? current.scrollbarWidth : 0,
        margin = current.margin,
        wMargin = getScalar(margin[1] + margin[3]),
        hMargin = getScalar(margin[0] + margin[2]),
        wPadding,
        hPadding,
        wSpace,
        hSpace,
        origWidth,
        origHeight,
        origMaxWidth,
        origMaxHeight,
        ratio,
        width_,
        height_,
        maxWidth_,
        maxHeight_,
        iframe,
        body;

      // Reset dimensions so we could re-check actual size
      wrap.add(skin).add(inner).width('auto').height('auto').removeClass('fancybox-tmp');

      wPadding = getScalar(skin.outerWidth(true) - skin.width());
      hPadding = getScalar(skin.outerHeight(true) - skin.height());

      // Any space between content and viewport (margin, padding, border, title)
      wSpace = wMargin + wPadding;
      hSpace = hMargin + hPadding;

      origWidth = isPercentage(width) ? (viewport.w - wSpace) * getScalar(width) / 100 : width;
      origHeight = isPercentage(height) ? (viewport.h - hSpace) * getScalar(height) / 100 : height;

      if (current.type === 'iframe') {
        iframe = current.content;

        if (current.autoHeight && iframe.data('ready') === 1) {
          try {
            if (iframe[0].contentWindow.document.location) {
              inner.width(origWidth).height(9999);

              body = iframe.contents().find('body');

              if (scrollOut) {
                body.css('overflow-x', 'hidden');
              }

              origHeight = body.height();
            }

          } catch (e) {}
        }

      } else if (current.autoWidth || current.autoHeight) {
        inner.addClass('fancybox-tmp');

        // Set width or height in case we need to calculate only one dimension
        if (!current.autoWidth) {
          inner.width(origWidth);
        }

        if (!current.autoHeight) {
          inner.height(origHeight);
        }

        if (current.autoWidth) {
          origWidth = inner.width();
        }

        if (current.autoHeight) {
          origHeight = inner.height();
        }

        inner.removeClass('fancybox-tmp');
      }

      width = getScalar(origWidth);
      height = getScalar(origHeight);

      ratio = origWidth / origHeight;

      // Calculations for the content
      minWidth = getScalar(isPercentage(minWidth) ? getScalar(minWidth, 'w') - wSpace : minWidth);
      maxWidth = getScalar(isPercentage(maxWidth) ? getScalar(maxWidth, 'w') - wSpace : maxWidth);

      minHeight = getScalar(isPercentage(minHeight) ? getScalar(minHeight, 'h') - hSpace : minHeight);
      maxHeight = getScalar(isPercentage(maxHeight) ? getScalar(maxHeight, 'h') - hSpace : maxHeight);

      // These will be used to determine if wrap can fit in the viewport
      origMaxWidth = maxWidth;
      origMaxHeight = maxHeight;

      if (current.fitToView) {
        maxWidth = Math.min(viewport.w - wSpace, maxWidth);
        maxHeight = Math.min(viewport.h - hSpace, maxHeight);
      }

      maxWidth_ = viewport.w - wMargin;
      maxHeight_ = viewport.h - hMargin;

      if (current.aspectRatio) {
        if (width > maxWidth) {
          width = maxWidth;
          height = getScalar(width / ratio);
        }

        if (height > maxHeight) {
          height = maxHeight;
          width = getScalar(height * ratio);
        }

        if (width < minWidth) {
          width = minWidth;
          height = getScalar(width / ratio);
        }

        if (height < minHeight) {
          height = minHeight;
          width = getScalar(height * ratio);
        }

      } else {
        width = Math.max(minWidth, Math.min(width, maxWidth));

        if (current.autoHeight && current.type !== 'iframe') {
          inner.width(width);

          height = inner.height();
        }

        height = Math.max(minHeight, Math.min(height, maxHeight));
      }

      // Try to fit inside viewport (including the title)
      if (current.fitToView) {
        inner.width(width).height(height);

        wrap.width(width + wPadding);

        // Real wrap dimensions
        width_ = wrap.width();
        height_ = wrap.height();

        if (current.aspectRatio) {
          while ((width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight) {
            if (steps++ > 19) {
              break;
            }

            height = Math.max(minHeight, Math.min(maxHeight, height - 10));
            width = getScalar(height * ratio);

            if (width < minWidth) {
              width = minWidth;
              height = getScalar(width / ratio);
            }

            if (width > maxWidth) {
              width = maxWidth;
              height = getScalar(width / ratio);
            }

            inner.width(width).height(height);

            wrap.width(width + wPadding);

            width_ = wrap.width();
            height_ = wrap.height();
          }

        } else {
          width = Math.max(minWidth, Math.min(width, width - (width_ - maxWidth_)));
          height = Math.max(minHeight, Math.min(height, height - (height_ - maxHeight_)));
        }
      }

      if (scrollOut && scrolling === 'auto' && height < origHeight && (width + wPadding + scrollOut) < maxWidth_) {
        width += scrollOut;
      }

      inner.width(width).height(height);

      wrap.width(width + wPadding);

      width_ = wrap.width();
      height_ = wrap.height();

      canShrink = (width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight;
      canExpand = current.aspectRatio ? (width < origMaxWidth && height < origMaxHeight && width < origWidth && height < origHeight) : ((width < origMaxWidth || height < origMaxHeight) && (width < origWidth || height < origHeight));

      $.extend(current, {
        dim: {
          width: getValue(width_),
          height: getValue(height_)
        },
        origWidth: origWidth,
        origHeight: origHeight,
        canShrink: canShrink,
        canExpand: canExpand,
        wPadding: wPadding,
        hPadding: hPadding,
        wrapSpace: height_ - skin.outerHeight(true),
        skinSpace: skin.height() - height
      });

      if (!iframe && current.autoHeight && height > minHeight && height < maxHeight && !canExpand) {
        inner.height('auto');
      }
    },

    _getPosition: function(onlyAbsolute) {
      var current = F.current,
        viewport = F.getViewport(),
        margin = current.margin,
        width = F.wrap.width() + margin[1] + margin[3],
        height = F.wrap.height() + margin[0] + margin[2],
        rez = {
          position: 'absolute',
          top: margin[0],
          left: margin[3]
        };

      if (current.autoCenter && current.fixed && !onlyAbsolute && height <= viewport.h && width <= viewport.w) {
        rez.position = 'fixed';

      } else if (!current.locked) {
        rez.top += viewport.y;
        rez.left += viewport.x;
      }

      rez.top = getValue(Math.max(rez.top, rez.top + ((viewport.h - height) * current.topRatio)));
      rez.left = getValue(Math.max(rez.left, rez.left + ((viewport.w - width) * current.leftRatio)));

      return rez;
    },

    _afterZoomIn: function() {
      var current = F.current;

      if (!current) {
        return;
      }

      F.isOpen = F.isOpened = true;

      F.wrap.css('overflow', 'visible').addClass('fancybox-opened');

      F.update();

      // Assign a click event
      if (current.closeClick || (current.nextClick && F.group.length > 1)) {
        F.inner.css('cursor', 'pointer').bind('click.fb', function(e) {
          if (!$(e.target).is('a') && !$(e.target).parent().is('a')) {
            e.preventDefault();

            F[current.closeClick ? 'close' : 'next']();
          }
        });
      }

      // Create a close button
      if (current.closeBtn) {
        $(current.tpl.closeBtn).appendTo(F.skin).bind(isTouch ? 'touchstart.fb' : 'click.fb', function(e) {
          e.preventDefault();

          F.close();
        });
      }

      // Create navigation arrows
      if (current.arrows && F.group.length > 1) {
        if (current.loop || current.index > 0) {
          $(current.tpl.prev).appendTo(F.outer).bind('click.fb', F.prev);
        }

        if (current.loop || current.index < F.group.length - 1) {
          $(current.tpl.next).appendTo(F.outer).bind('click.fb', F.next);
        }
      }

      F.trigger('afterShow');

      // Stop the slideshow if this is the last item
      if (!current.loop && current.index === current.group.length - 1) {
        F.play(false);

      } else if (F.opts.autoPlay && !F.player.isActive) {
        F.opts.autoPlay = false;

        F.play();
      }
    },

    _afterZoomOut: function(obj) {
      obj = obj || F.current;

      $('.fancybox-wrap').trigger('onReset').remove();

      $.extend(F, {
        group: {},
        opts: {},
        router: false,
        current: null,
        isActive: false,
        isOpened: false,
        isOpen: false,
        isClosing: false,
        wrap: null,
        skin: null,
        outer: null,
        inner: null
      });

      F.trigger('afterClose', obj);
    }
  });

  /*
   *    Default transitions
   */

  F.transitions = {
    getOrigPosition: function() {
      var current = F.current,
        element = current.element,
        orig = current.orig,
        pos = {},
        width = 50,
        height = 50,
        hPadding = current.hPadding,
        wPadding = current.wPadding,
        viewport = F.getViewport();

      if (!orig && current.isDom && element.is(':visible')) {
        orig = element.find('img:first');

        if (!orig.length) {
          orig = element;
        }
      }

      if (isQuery(orig)) {
        pos = orig.offset();

        if (orig.is('img')) {
          width = orig.outerWidth();
          height = orig.outerHeight();
        }

      } else {
        pos.top = viewport.y + (viewport.h - height) * current.topRatio;
        pos.left = viewport.x + (viewport.w - width) * current.leftRatio;
      }

      if (F.wrap.css('position') === 'fixed' || current.locked) {
        pos.top -= viewport.y;
        pos.left -= viewport.x;
      }

      pos = {
        top: getValue(pos.top - hPadding * current.topRatio),
        left: getValue(pos.left - wPadding * current.leftRatio),
        width: getValue(width + wPadding),
        height: getValue(height + hPadding)
      };

      return pos;
    },

    step: function(now, fx) {
      var ratio,
        padding,
        value,
        prop = fx.prop,
        current = F.current,
        wrapSpace = current.wrapSpace,
        skinSpace = current.skinSpace;

      if (prop === 'width' || prop === 'height') {
        ratio = fx.end === fx.start ? 1 : (now - fx.start) / (fx.end - fx.start);

        if (F.isClosing) {
          ratio = 1 - ratio;
        }

        padding = prop === 'width' ? current.wPadding : current.hPadding;
        value = now - padding;

        F.skin[prop](getScalar(prop === 'width' ? value : value - (wrapSpace * ratio)));
        F.inner[prop](getScalar(prop === 'width' ? value : value - (wrapSpace * ratio) - (skinSpace * ratio)));
      }
    },

    zoomIn: function() {
      var current = F.current,
        startPos = current.pos,
        effect = current.openEffect,
        elastic = effect === 'elastic',
        endPos = $.extend({
          opacity: 1
        }, startPos);

      // Remove "position" property that breaks older IE
      delete endPos.position;

      if (elastic) {
        startPos = this.getOrigPosition();

        if (current.openOpacity) {
          startPos.opacity = 0.1;
        }

      } else if (effect === 'fade') {
        startPos.opacity = 0.1;
      }

      F.wrap.css(startPos).animate(endPos, {
        duration: effect === 'none' ? 0 : current.openSpeed,
        easing: current.openEasing,
        step: elastic ? this.step : null,
        complete: F._afterZoomIn
      });
    },

    zoomOut: function() {
      var current = F.current,
        effect = current.closeEffect,
        elastic = effect === 'elastic',
        endPos = {
          opacity: 0.1
        };

      if (elastic) {
        endPos = this.getOrigPosition();

        if (current.closeOpacity) {
          endPos.opacity = 0.1;
        }
      }

      F.wrap.animate(endPos, {
        duration: effect === 'none' ? 0 : current.closeSpeed,
        easing: current.closeEasing,
        step: elastic ? this.step : null,
        complete: F._afterZoomOut
      });
    },

    changeIn: function() {
      var current = F.current,
        effect = current.nextEffect,
        startPos = current.pos,
        endPos = {
          opacity: 1
        },
        direction = F.direction,
        distance = 200,
        field;

      startPos.opacity = 0.1;

      if (effect === 'elastic') {
        field = direction === 'down' || direction === 'up' ? 'top' : 'left';

        if (direction === 'down' || direction === 'right') {
          startPos[field] = getValue(getScalar(startPos[field]) - distance);
          endPos[field] = '+=' + distance + 'px';

        } else {
          startPos[field] = getValue(getScalar(startPos[field]) + distance);
          endPos[field] = '-=' + distance + 'px';
        }
      }

      // Workaround for http://bugs.jquery.com/ticket/12273
      if (effect === 'none') {
        F._afterZoomIn();

      } else {
        F.wrap.css(startPos).animate(endPos, {
          duration: current.nextSpeed,
          easing: current.nextEasing,
          complete: function() {
            // This helps FireFox to properly render the box
            setTimeout(F._afterZoomIn, 20);
          }
        });
      }
    },

    changeOut: function() {
      var previous = F.previous,
        effect = previous.prevEffect,
        endPos = {
          opacity: 0.1
        },
        direction = F.direction,
        distance = 200;

      if (effect === 'elastic') {
        endPos[direction === 'down' || direction === 'up' ? 'top' : 'left'] = (direction === 'up' || direction === 'left' ? '-' : '+') + '=' + distance + 'px';
      }

      previous.wrap.animate(endPos, {
        duration: effect === 'none' ? 0 : previous.prevSpeed,
        easing: previous.prevEasing,
        complete: function() {
          $(this).trigger('onReset').remove();
        }
      });
    }
  };

  /*
   *    Overlay helper
   */

  F.helpers.overlay = {
    defaults: {
      closeClick: true, // if true, fancyBox will be closed when user clicks on the overlay
      speedOut: 200, // duration of fadeOut animation
      showEarly: true, // indicates if should be opened immediately or wait until the content is ready
      css: {}, // custom CSS properties
      locked: !isTouch, // if true, the content will be locked into overlay
      fixed: true // if false, the overlay CSS position property will not be set to "fixed"
    },

    overlay: null, // current handle
    fixed: false, // indicates if the overlay has position "fixed"

    // Public methods
    create: function(opts) {
      opts = $.extend({}, this.defaults, opts);

      if (this.overlay) {
        this.close();
      }

      this.overlay = $('<div class="fancybox-overlay"></div>').appendTo('body');
      this.fixed = false;

      if (opts.fixed && F.defaults.fixed) {
        this.overlay.addClass('fancybox-overlay-fixed');

        this.fixed = true;
      }
    },

    open: function(opts) {
      var that = this;

      opts = $.extend({}, this.defaults, opts);

      if (this.overlay) {
        this.overlay.unbind('.overlay').width('auto').height('auto');

      } else {
        this.create(opts);
      }

      if (!this.fixed) {
        W.bind('resize.overlay', $.proxy(this.update, this));

        this.update();
      }

      if (opts.closeClick) {
        this.overlay.bind('click.overlay', function(e) {
          if ($(e.target).hasClass('fancybox-overlay')) {
            if (F.isActive) {
              F.close();
            } else {
              that.close();
            }
          }
        });
      }

      this.overlay.css(opts.css).show();
    },

    close: function() {
      $('.fancybox-overlay').remove();

      W.unbind('resize.overlay');

      this.overlay = null;

      if (this.margin !== false) {
        $('body').css('margin-right', this.margin);

        this.margin = false;
      }

      if (this.el) {
        this.el.removeClass('fancybox-lock');
      }
    },

    // Private, callbacks

    update: function() {
      var width = '100%',
        offsetWidth;

      // Reset width/height so it will not mess
      this.overlay.width(width).height('100%');

      // jQuery does not return reliable result for IE
      if ($.browser.msie) {
        offsetWidth = Math.max(document.documentElement.offsetWidth, document.body.offsetWidth);

        if (D.width() > offsetWidth) {
          width = D.width();
        }

      } else if (D.width() > W.width()) {
        width = D.width();
      }

      this.overlay.width(width).height(D.height());
    },

    // This is where we can manipulate DOM, because later it would cause iframes to reload
    onReady: function(opts, obj) {
      $('.fancybox-overlay').stop(true, true);

      if (!this.overlay) {
        this.margin = D.height() > W.height() || $('body').css('overflow-y') === 'scroll' ? $('body').css('margin-right') : false;
        this.el = document.all && !document.querySelector ? $('html') : $('body');

        this.create(opts);
      }

      if (opts.locked && this.fixed) {
        obj.locked = this.overlay.append(obj.wrap);
        obj.fixed = false;
      }

      if (opts.showEarly === true) {
        this.beforeShow.apply(this, arguments);
      }
    },

    beforeShow: function(opts, obj) {
      if (obj.locked) {
        this.el.addClass('fancybox-lock');

        if (this.margin !== false) {
          $('body').css('margin-right', getScalar(this.margin) + obj.scrollbarWidth);
        }
      }

      this.open(opts);
    },

    onUpdate: function() {
      if (!this.fixed) {
        this.update();
      }
    },

    afterClose: function(opts) {
      // Remove overlay if exists and fancyBox is not opening
      // (e.g., it is not being open using afterClose callback)
      if (this.overlay && !F.isActive) {
        this.overlay.fadeOut(opts.speedOut, $.proxy(this.close, this));
      }
    }
  };

  /*
   *    Title helper
   */

  F.helpers.title = {
    defaults: {
      type: 'float', // 'float', 'inside', 'outside' or 'over',
      position: 'bottom' // 'top' or 'bottom'
    },

    beforeShow: function(opts) {
      var current = F.current,
        text = current.title,
        type = opts.type,
        title,
        target;

      if ($.isFunction(text)) {
        text = text.call(current.element, current);
      }

      if (!isString(text) || $.trim(text) === '') {
        return;
      }

      title = $('<div class="fancybox-title fancybox-title-' + type + '-wrap">' + text + '</div>');

      switch (type) {
        case 'inside':
          target = F.skin;
          break;

        case 'outside':
          target = F.wrap;
          break;

        case 'over':
          target = F.inner;
          break;

        default: // 'float'
          target = F.skin;

          title.appendTo('body');

          if ($.browser.msie) {
            title.width(title.width());
          }

          title.wrapInner('<span class="child"></span>');

          //Increase bottom margin so this title will also fit into viewport
          F.current.margin[2] += Math.abs(getScalar(title.css('margin-bottom')));
          break;
      }

      title[(opts.position === 'top' ? 'prependTo' : 'appendTo')](target);
    }
  };

  // jQuery plugin initialization
  $.fn.fancybox = function(options) {
    var index,
      that = $(this),
      selector = this.selector || '',
      run = function(e) {
        var what = $(this).blur(),
          idx = index,
          relType, relVal;

        if (!(e.ctrlKey || e.altKey || e.shiftKey || e.metaKey) && !what.is('.fancybox-wrap')) {
          relType = options.groupAttr || 'data-fancybox-group';
          relVal = what.attr(relType);

          if (!relVal) {
            relType = 'rel';
            relVal = what.get(0)[relType];
          }

          if (relVal && relVal !== '' && relVal !== 'nofollow') {
            what = selector.length ? $(selector) : that;
            what = what.filter('[' + relType + '="' + relVal + '"]');
            idx = what.index(this);
          }

          options.index = idx;

          // Stop an event from bubbling if everything is fine
          if (F.open(what, options) !== false) {
            e.preventDefault();
          }
        }
      };

    options = options || {};
    index = options.index || 0;

    if (!selector || options.live === false) {
      that.unbind('click.fb-start').bind('click.fb-start', run);

    } else {
      D.undelegate(selector, 'click.fb-start').delegate(selector + ":not('.fancybox-item, .fancybox-nav')", 'click.fb-start', run);
    }

    this.filter('[data-fancybox-start=1]').trigger('click');

    return this;
  };

  // Tests that need a body at doc ready
  D.ready(function() {
    if ($.scrollbarWidth === undefined) {
      // http://benalman.com/projects/jquery-misc-plugins/#scrollbarwidth
      $.scrollbarWidth = function() {
        var parent = $('<div style="width:50px;height:50px;overflow:auto"><div/></div>').appendTo('body'),
          child = parent.children(),
          width = child.innerWidth() - child.height(99).innerWidth();

        parent.remove();

        return width;
      };
    }

    if ($.support.fixedPosition === undefined) {
      $.support.fixedPosition = (function() {
        var elem = $('<div style="position:fixed;top:20px;"></div>').appendTo('body'),
          fixed = (elem[0].offsetTop === 20 || elem[0].offsetTop === 15);

        elem.remove();

        return fixed;
      }());
    }

    $.extend(F.defaults, {
      scrollbarWidth: $.scrollbarWidth(),
      fixed: $.support.fixedPosition,
      parent: $('body')
    });
  });

}(window, document, jQuery));
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.