Update version to 0.4
parent
d4d610beaa
commit
d3e3bd5973
|
|
@ -1,15 +1,11 @@
|
||||||
/**
|
/**
|
||||||
* jQuery Lightbox
|
* jQuery Lightbox
|
||||||
* Version 0.3 - 09/17/2007
|
* Version 0.4 - 09/17/2007
|
||||||
* @author Warren Krewenki
|
* @author Warren Krewenki
|
||||||
*
|
*
|
||||||
* Based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
* Based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
||||||
* Originally written to make use of the Prototype framework, and Script.acalo.us, now altered to use jQuery.
|
* Originally written to make use of the Prototype framework, and Script.acalo.us, now altered to use jQuery.
|
||||||
*
|
*
|
||||||
* New in this version:
|
|
||||||
* - fully encapsulated in one JSON object
|
|
||||||
* - new method of adding the lightbox html
|
|
||||||
* - removal of some dead functions
|
|
||||||
**/
|
**/
|
||||||
|
|
||||||
var Lightbox = {
|
var Lightbox = {
|
||||||
|
|
@ -20,7 +16,12 @@ var Lightbox = {
|
||||||
imageArray : new Array,
|
imageArray : new Array,
|
||||||
activeImage : null,
|
activeImage : null,
|
||||||
inprogress : false,
|
inprogress : false,
|
||||||
|
resizeSpeed : 350,
|
||||||
|
destroyElement: function(id){
|
||||||
|
if(el = document.getElementById(id)){
|
||||||
|
el.parentNode.removeChild(el);
|
||||||
|
}
|
||||||
|
},
|
||||||
initialize: function() {
|
initialize: function() {
|
||||||
// attach lightbox to any links with rel 'lightbox'
|
// attach lightbox to any links with rel 'lightbox'
|
||||||
$("a").each(function(){
|
$("a").each(function(){
|
||||||
|
|
@ -32,7 +33,8 @@ var Lightbox = {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$("body").append('<div id="overlay"></div><div id="lightbox"><div id="outerImageContainer"><div id="imageContainer"><img id="lightboxImage"><div style="" id="hoverNav"><a href="#" id="prevLink"></a><a href="#" id="nextLink"></a></div><div id="loading"><a href="#" id="loadingLink"><img src="admin/css/images/loading.gif"></a></div></div></div><div id="imageDataContainer"><div id="imageData"><div id="imageDetails"><span id="caption"></span><span id="numberDisplay"></span></div><div id="bottomNav"><a href="#" id="bottomNavClose"><img src="admin/css/images/close.gif"></a></div></div></div></div>');
|
Lightbox.destroyElement('overlay'); Lightbox.destroyElement('lightbox');
|
||||||
|
$("body").append('<div id="overlay"></div><div id="lightbox"><div id="outerImageContainer"><div id="imageContainer"><img id="lightboxImage"><div style="" id="hoverNav"><a href="#" id="prevLink"></a><a href="#" id="nextLink"></a></div><div id="loading"><a href="#" id="loadingLink"><img src="'+Lightbox.fileLoadingImage+'"></a></div></div></div><div id="imageDataContainer"><div id="imageData"><div id="imageDetails"><span id="caption"></span><span id="numberDisplay"></span></div><div id="bottomNav"><a href="#" id="bottomNavClose"><img src="'+Lightbox.fileBottomNavCloseImage+'"></a></div></div></div></div>');
|
||||||
$("#overlay").click(function(){ Lightbox.end(); }).hide();
|
$("#overlay").click(function(){ Lightbox.end(); }).hide();
|
||||||
$("#lightbox").click(function(){ Lightbox.end();}).hide();
|
$("#lightbox").click(function(){ Lightbox.end();}).hide();
|
||||||
$("#loadingLink").click(function(){ Lightbox.end(); return false;});
|
$("#loadingLink").click(function(){ Lightbox.end(); return false;});
|
||||||
|
|
@ -47,13 +49,6 @@ var Lightbox = {
|
||||||
start: function(imageLink) {
|
start: function(imageLink) {
|
||||||
$("select, embed, object").hide();
|
$("select, embed, object").hide();
|
||||||
|
|
||||||
// *
|
|
||||||
var urlImg = $("img", imageLink).attr("src");
|
|
||||||
urlImg = urlImg.split("classes");
|
|
||||||
//urlImg = urlImg[0]+'admin/css/images/loading.gif';
|
|
||||||
$("#loadingLink > img").attr({src:urlImg[0]+'admin/css/images/loading.gif'})
|
|
||||||
$("#bottomNavClose > img").attr({src:urlImg[0]+'admin/css/images/close.gif'})
|
|
||||||
|
|
||||||
// stretch overlay to fill page and fade in
|
// stretch overlay to fill page and fade in
|
||||||
var arrayPageSize = Lightbox.getPageSize();
|
var arrayPageSize = Lightbox.getPageSize();
|
||||||
$("#overlay").hide().css({width: '100%', height: arrayPageSize[1]+'px', opacity : Lightbox.overlayOpacity}).fadeIn();
|
$("#overlay").hide().css({width: '100%', height: arrayPageSize[1]+'px', opacity : Lightbox.overlayOpacity}).fadeIn();
|
||||||
|
|
@ -119,7 +114,6 @@ var Lightbox = {
|
||||||
|
|
||||||
// once image is preloaded, resize image container
|
// once image is preloaded, resize image container
|
||||||
imgPreloader.onload=function(){
|
imgPreloader.onload=function(){
|
||||||
console.log(Lightbox.activeImage);
|
|
||||||
document.getElementById('lightboxImage').src = Lightbox.imageArray[Lightbox.activeImage][0];
|
document.getElementById('lightboxImage').src = Lightbox.imageArray[Lightbox.activeImage][0];
|
||||||
Lightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
|
Lightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
|
||||||
}
|
}
|
||||||
|
|
@ -148,10 +142,9 @@ var Lightbox = {
|
||||||
wDiff = this.widthCurrent - widthNew;
|
wDiff = this.widthCurrent - widthNew;
|
||||||
hDiff = this.heightCurrent - heightNew;
|
hDiff = this.heightCurrent - heightNew;
|
||||||
|
|
||||||
$('#outerImageContainer').animate({width: widthNew},400,'linear',function(){
|
$('#outerImageContainer').animate({width: widthNew, height: heightNew},Lightbox.resizeSpeed,'linear',function(){
|
||||||
$("#outerImageContainer").animate({height: heightNew},400,'linear',function(){
|
|
||||||
Lightbox.showImage();
|
Lightbox.showImage();
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue