对pirobox做的修改

在jquery的lightbox插件中，pirobox算是比较清爽的，不过有些不足的地方，小修一下就好。修改基于版本1.2.2。

 

原始图片尺寸太大出屏幕

 

我增加了三个参数到opt中：

maxWidth: null, maxHeight: null, autoSize: true

修改img.onload

img.onload = function() { var imgH = img.height; var imgW = img.width; var ratioHW = imgH / imgW; var main_cont_h = $(main_cont).height(); var w_H = $(window).height(); var w_W = $(window).width(); if (opt.autoSize) { if (imgH > w_H) { opt.maxHeight = w_H * 0.9; imgW = w_H / ratioHW; } if (imgW > w_W) { opt.maxWidth = w_W * 0.9; imgH = w_W * ratioHW; } } if (opt.maxHeight != null && imgH > opt.maxHeight) { imgH = opt.maxHeight; imgW = imgH / ratioHW; } if (opt.maxWidth != null && imgW > opt.maxWidth) { imgW = opt.maxWidth; imgH = imgW * ratioHW; } $(img).height(imgH).width(imgW).hide(); $('.c_c div').animate({ height: imgH + 'px', width: imgW + 'px' }, opt.my_speed); var fix = imgH / w_H * 2.3; if (w_H < imgH) { h_fix = fix; } else { h_fix = 2; } main_cont.animate({ height: (imgH + 40) + 'px', width: (imgW + 40) + 'px', marginLeft: '-' + ((imgW) / 2 + 20) + 'px', marginTop: parseInt($(document).scrollTop()) - (imgH / h_fix) }, opt.my_speed, function() { $('.piro_nav,.caption').css({ width: (imgW) + 'px', 'margin-bottom': '10px' }); $('.piro_nav').css('margin-left', '-' + (imgW) / 2 + 'px'); var caption_height = caption.height(); $('.c_c div').append(img); piro_close.css('display', 'block'); piro_next.add(piro_prev).add(piro_close).css('visibility', 'visible'); caption.css({ 'visibility': 'visible', 'display': 'block', 'opacity': '0.8', 'overflow': 'hidden' }); main_cont.hover(function() { caption.stop().fadeTo(200, 0.8); }, function() { caption.stop().fadeTo(200, 0); }); $(img).fadeIn(300); main_cont.removeClass('loading'); if (opt.slideShow === true) { piro_play.add(piro_stop).show(); } else { piro_play.add(piro_stop).hide(); } }); }


图片url中包含空格不能显示全图

用string.replace全局替换即可。（因csdn编辑框，只能贴部分code）：

 

... a href=' + this_url.replace(/ /g, '%20') + ' class="link_to" ... 代替原来的

... a href=' + this_url + ' class="link_to" ...