JSFiddle - React, Tailwind, and code Playground
JavaScript
/*!
Slimbox v2.04 - The ultimate lightweight Lightbox clone for jQuery
(c) 2007-2010 Christophe Beyls <http://www.digitalia.be>
MIT-style license.
Modified by Neil Storer <http://www.trips.elusien.co.uk>
Modified by Travis Hydzik <http://thydzik.com>
*/
// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED)
if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
jQuery(function($) {
$("a[rel^='lightbox']").slimbox({/* Put custom options here */}, null, function(el) {
return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
});
});
}
(function ($) {
// Global variables, accessible to Slimbox onlyscaler,
var win = $(window), options, images, activeImage = -1, activeURL, prevImage, nextImage, compatibleOverlay, middle, centerWidth, centerHeight,
slideInterval, setInter, scaler,
ie6 = !window.XMLHttpRequest, hiddenElements = [], documentElement = document.documentElement,
// Preload images
preload = {}, preloadPrev = new Image(), preloadNext = new Image(),
// DOM elements
overlay, center, image, slide, sizer, prevLink, nextLink, bottomContainer, bottom, caption, number;
/*
Initialization
*/
$(function () {
// Append the Slimbox HTML code at the bottom of the document
$("body").append(
$([
overlay = $('<div id="lbOverlay" />')[0],
center = $('<div id="lbCenter" />')[0],
bottomContainer = $('<div id="lbBottomContainer" />')[0]
]).css("display", "none")
);
image = $('<div id="lbImage" />').appendTo(center).append(
sizer = $('<div style="position: relative;" />').append([
slide = $('<img id="lbSlide" src="white.gif" alt="" />')[0],
nextLink = $('<a id="lbNextLink" href="#" />').text('.').click(next)[0],
prevLink = $('<a id="lbPrevLink" href="#" />').text('.').click(previous)[0]
])[0]
)[0];
window.nextlink = document.getElementById('lbNextLink');
bottom = $('<div id="lbBottom" />').appendTo(bottomContainer).append([
$('<a...