User:Shahadat/SimpleLightbox
Jump to navigation
Jump to search
![]() | Feel free to contribute to this page! Your contribution can really help this script. Feedback will also welcome. |
Documentation
![](https://upload.wikimedia.org/wikipedia/commons/thumb/0/0f/SimpleLightbox.png/300px-SimpleLightbox.png)
SimpleLightbox tool on Flowers article
SimpleLightbox is a simple lightbox user script, which enlarges images without leaving the page, faster and easier than Media Viewer. Works with most images and formats. Just click on the image.
Install
To use this script place the following line in your skin's .js page or your common.js page:
{{subst:iusc|User:Shahadat/SimpleLightbox.js}}
Credits
$(document).ready(function() {
$('body').append('<div id="lightbox" style="display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);text-align:center;z-index:9999"></div>');
$('a.image').click(function(e) {
e.preventDefault();
if ($(this).find('img').attr('src').match('/thumb/')) {
var src = 'http:' + $(this).find('img').attr('src').replace('/thumb','').replace(/\/[\-_.%\w]*$/, '');
} else {
var src = $(this).find('img').attr('src');
}
$('#lightbox')
.html('<img src="'+src+'" style="background:#fff;box-shadow: 0 0 25px #111;max-height:100%;max-width:100%;vertical-align:middle;cursor:pointer;" />')
.css('line-height', $(window).height()+'px')
.fadeIn('fast')
.live('click', function() {
$(this).fadeOut('fast');
});
});
});
Script Attribution
![]() | This script was manually imported from Wikipedia in compliance with their CC-BY-SA license. This script is utilized either partially or in full, incorporating corrections, modifications, or imported from the original script. For details regarding the original script and its creator, please refer to the following link: https://en.wikipedia.org/wiki/User:JGMalcolm/SimpleLightbox |