Michel2/auto-thickbox-plus
1
0 Fork 0
Code Activity

NEW: Auto Resize feature works even when resizing browser window. Moved Auto Resize code from tb_show() to new tb_reposition(), and calls it when both showing an image and resizing window.

Browse Source
This commit is contained in:
attosoft committed 2012-09-29 04:15:40 +00:00
1 parent 71aafb61ec
commit a935e46c7c
1 file changed
+43 -34
Download Patch File Download Diff File Expand all files Collapse all files
thickbox.js
+43 -34
View File
@@ -192,27 +192,8 @@ function tb_show(caption, url, imageGroup) {//function called when the user clic
var queryString = url.replace(/^[^\?]+\??/,'');
var params = tb_parseQuery( queryString );
// Resizing large images - orginal by Christian Montoya edited by me.
var pagesize = tb_getPageSize();
var x = pagesize[0] - 150;
var y = pagesize[1] - 150;
var imageWidth = params['width'] ? Math.min(params['width']*1, imgPreloader.width) : imgPreloader.width;
var imageHeight = params['height'] ? Math.min(params['height']*1, imgPreloader.height) : imgPreloader.height;
tb_fitWidth = x;
tb_fitHeight = Math.round(imageHeight * (x / imageWidth));
if (tb_fitHeight > y) {
tb_fitWidth = Math.round(tb_fitWidth * (y / tb_fitHeight));
tb_fitHeight = y;
}
tb_fitToWindow = tb_options.auto_resize && (imageWidth > x || imageHeight > y);
if (tb_fitToWindow) {
imageWidth = tb_fitWidth;
imageHeight = tb_fitHeight;
}
// End Resizing
if (typeof caption == "object") caption = tb_caption(caption);
TB_Image = "<img id='TB_Image' src='"+url+"' width='"+imageWidth+"' height='"+imageHeight+"' alt='"+caption+"'/>";
TB_Image = "<img id='TB_Image' src='"+url+"' width='"+imgPreloader.width+"' height='"+imgPreloader.height+"' alt='"+caption+"'/>";
if (tb_options.click_img == "close" || (!imageGroup && tb_options.click_end == "close"))
TB_Image = "<a href='' id='TB_ImageOff' title='"+thickboxL10n.close+"'>" + TB_Image + "</a>";
else if (tb_options.click_img == "open")
@@ -234,17 +215,7 @@ function tb_show(caption, url, imageGroup) {//function called when the user clic
}
if (!imageGroup || !caption)
jQuery("#TB_window").addClass("TB_singleLine");
if (jQuery("#TB_Image").height() == 0) jQuery("#TB_Image").height(imageHeight); // workaround for "img { height: auto; }" style
var size = tb_getSize(jQuery("#TB_Image"), "margin");
TB_WIDTH = size[0];
TB_HEIGHT = size[1] + tb_getSize(jQuery("#TB_closeWindow"), "margin")[1];
if (TB_WIDTH < params['width']*1) {
TB_WIDTH = params['width']*1;
jQuery('#TB_Image').css({marginLeft: 'auto', marginRight: 'auto'});
}
if (TB_HEIGHT < params['height']*1)
TB_HEIGHT = params['height']*1;
if (params['modal'] == "true")
jQuery("#TB_overlay").unbind();
@@ -306,7 +277,7 @@ function tb_show(caption, url, imageGroup) {//function called when the user clic
}
}
if (id && title && handler) {
var height = size[1];
var height = tb_getSize(jQuery("#TB_Image"), "margin")[1];
jQuery("#TB_window").append("<div id='TB_ImageClick'><a href='' id='"+id+"' title='"+title+"' style='height:"+height+"px;'><span></span></a></div>");
jQuery("#"+id).click(handler);
}
@@ -345,7 +316,7 @@ function tb_show(caption, url, imageGroup) {//function called when the user clic
}
}
if ((id && title && handler) || (id2 && title2 && handler2)) {
var height = size[1];
var height = tb_getSize(jQuery("#TB_Image"), "margin")[1];
var link = link2 = "";
if (id && title && handler) link = "<a href='' id='"+id+"' class='TB_ImageLeft' title='"+title+"' style='height:"+height+"px;'></a>";
if (id2 && title2 && handler2) link2 = "<a href='' id='"+id2+"' class='TB_ImageRight' title='"+title2+"' style='height:"+height+"px;'></a>";
@@ -492,7 +463,8 @@ function tb_show(caption, url, imageGroup) {//function called when the user clic
.bind('mouseleave.thickbox', function () { tb_hover(jQuery('#TB_CaptionBar'), tb_options.effect_cap, true); });
}
tb_position();
tb_reposition(params);
jQuery(window).bind('resize.thickbox', function() { tb_reposition(params); });
jQuery("#TB_load").remove();
if (tb_options.click_img == "close" || (!imageGroup && tb_options.click_end == "close"))
jQuery("#TB_ImageOff").click(tb_remove);
@@ -742,7 +714,7 @@ function tb_remove() {
break;
}
jQuery("#TB_load").remove();
jQuery(document).unbind('.thickbox');
jQuery(document).add(window).unbind('.thickbox');
return false;
}
@@ -774,6 +746,43 @@ function tb_position() {
}
}
function tb_reposition(params) {
// Resizing large images - orginal by Christian Montoya edited by me.
var pagesize = tb_getPageSize();
var x = pagesize[0] - 150;
var y = pagesize[1] - 150;
var imageWidth = params['width'] ? Math.min(params['width']*1, imgPreloader.width) : imgPreloader.width;
var imageHeight = params['height'] ? Math.min(params['height']*1, imgPreloader.height) : imgPreloader.height;
tb_fitWidth = x;
tb_fitHeight = Math.round(imageHeight * (x / imageWidth));
if (tb_fitHeight > y) {
tb_fitWidth = Math.round(tb_fitWidth * (y / tb_fitHeight));
tb_fitHeight = y;
}
tb_fitToWindow = tb_options.auto_resize && (imageWidth > x || imageHeight > y);
if (tb_fitToWindow) {
imageWidth = tb_fitWidth;
imageHeight = tb_fitHeight;
}
// End Resizing
jQuery("#TB_Image").attr("width", imageWidth).attr("height", imageHeight);
if (jQuery("#TB_Image").height() == 0) jQuery("#TB_Image").height(imageHeight); // workaround for "img { height: auto; }" style
var size = tb_getSize(jQuery("#TB_Image"), "margin");
TB_WIDTH = size[0];
TB_HEIGHT = size[1] + tb_getSize(jQuery("#TB_closeWindow"), "margin")[1];
if (TB_WIDTH < params['width']*1) {
TB_WIDTH = params['width']*1;
jQuery('#TB_Image').css({marginLeft: 'auto', marginRight: 'auto'});
}
if (TB_HEIGHT < params['height']*1)
TB_HEIGHT = params['height']*1;
tb_position();
}
function tb_parseQuery ( query ) {
var Params = {};
if ( ! query ) {return Params;}// return empty object