MediaBox

jQuery Plugin for video and image gallery.

Example

http://noguhiro.github.io/MediaBox/

Setup

JavaScript

$(document).ready(function() {   'use strict';   $('.demo').mediaBox(); }); 

HTML

<button class="demo" data-src="demo.png" data-width="100" data-height="100">OpenImage</button> <button class="demo" data-src="demo.mp4" data-width="100" data-height="100">OpenVideo</button> 

Settings.

defaults.

{     html: {       base: '<div class="mb-base">' +               '<div class="mb-contents">' +                 '<span class="mb-close mb-decoration-close"><img src=":src"></span>' +                 '<div class="mb-arrange"></div>' +               '</div>' +             '</div>',       video: '<video class="mb-video mb-close" autoplay src=":src" width=":width" height=":height"></video>',       image: '<img class="mb-image mb-close" src=":src" width=":width" height=":height" />'     },     elem: {       base: '.mb-base',       contents: '.mb-contents',       arrange: '.mb-arrange',       video: '.mb-video',       image: '.mb-image',       close: '.mb-close'     },     closeImage: 'close.png',     openSpeed: 500,     closeSpeed: 300 } 

customize.

$(selector).mediaBox({     closeImage: 'images/close.png',     openSpeed: 100,     closeSpeed: 100 });