我有一个奇怪的问题,灯箱似乎工作但没有出现更大的图像.
控制台中也没有错误.
我的画廊HTML设置如下:
<a href="images/here.jpg" rel="lightBox"><img src="images/here.jpg" alt="FAST Festival Image Gallery"></a>
我确保JQuery,JQuery UI,LightBox.css,LighBox.js和jquery.smooth-scroll.min.js都存在.
该页面是:http://www.fastfestival.com.au/gallery.html
有谁知道发生什么事了?
编辑:
检查控制台我发现当它被调用时,LightBox div中没有出现图像
< div id =“lightBoxOverlay”style =“width:1633px; height:1234px; display:block;”>< / div>
解决方法@H_404_24@
与jQuery 1.9的冲突与
new behavior for the .after() method有关.您可以在LightBox中重写LightBox.prototype.build方法,以避免在断开连接的节点上使用.after()方法,LightBox将再次使用jQuery 1.9.
我的快速黑客攻击解决方案(有效)紧随其后.它可以通过更多链接进行清理,但我决定将其留待以后或者可能只是等待LightBox v2.51加速以包含标准化修复.
LightBox.prototype.build = function() {
var $lightBox,_this = this;
// Editing here for jQuery 1.9 conflict
$("<div>",{ "id": "lightBoxOverlay" }).appendTo("body");
lightBox = $("<div>",{ "id": "lightBox" });
outerContainer = $("<div>",{ "class": "lb-outerContainer" });
container = $("<div>",{ "class": "lb-container" });
$(container).append($("<img>",{ "class": "lb-image" }));
nav = $("<div>",{ "class": "lb-nav" });
$(nav).append($("<a>",{ "class": "lb-prev" }));
$(nav).append($("<a>",{ "class": "lb-next" }));
loader = $("<div>",{ "class": "lb-loader" });
$(loader).append($("<a>",{ "class": "lb-cancel" }).append($("<img>",{ "src": this.options.fileLoadingImage })));
$(container).append(nav);
$(container).append(loader);
$(outerContainer).append(container);
dataContainer = $("<div>",{ "class": "lb-dataContainer" });
data = $("<div>",{ "class": "lb-data" });
details = $("<div>",{ "class": "lb-details" });
$(details).append($("<span>",{ "class": "lb-caption" }));
$(details).append($("<span>",{ "class": "lb-number" }));
closeContainer = $("<div>",{ "class": "lb-closeContainer" });
$(closeContainer).append($("<a>",{ "class": "lb-close" }).append($("<img>",{ "src": this.options.fileCloseImage })));
$(data).append(details);
$(data).append(closeContainer);
$(dataContainer).append(data);
$(lightBox).append(outerContainer);
$(lightBox).append(dataContainer);
$(lightBox).appendTo("body");
// End custom changes
$('#lightBoxOverlay').hide().on('click',function(e) {
_this.end();
return false;
});
$lightBox = $('#lightBox');
$lightBox.hide().on('click',function(e) {
if ($(e.target).attr('id') === 'lightBox') _this.end();
return false;
});
$lightBox.find('.lb-outerContainer').on('click',function(e) {
if ($(e.target).attr('id') === 'lightBox') _this.end();
return false;
});
$lightBox.find('.lb-prev').on('click',function(e) {
_this.changeImage(_this.currentImageIndex - 1);
return false;
});
$lightBox.find('.lb-next').on('click',function(e) {
_this.changeImage(_this.currentImageIndex + 1);
return false;
});
$lightBox.find('.lb-loader,.lb-close').on('click',function(e) {
_this.end();
return false;
});
};
我的快速黑客攻击解决方案(有效)紧随其后.它可以通过更多链接进行清理,但我决定将其留待以后或者可能只是等待LightBox v2.51加速以包含标准化修复.
LightBox.prototype.build = function() { var $lightBox,_this = this; // Editing here for jQuery 1.9 conflict $("<div>",{ "id": "lightBoxOverlay" }).appendTo("body"); lightBox = $("<div>",{ "id": "lightBox" }); outerContainer = $("<div>",{ "class": "lb-outerContainer" }); container = $("<div>",{ "class": "lb-container" }); $(container).append($("<img>",{ "class": "lb-image" })); nav = $("<div>",{ "class": "lb-nav" }); $(nav).append($("<a>",{ "class": "lb-prev" })); $(nav).append($("<a>",{ "class": "lb-next" })); loader = $("<div>",{ "class": "lb-loader" }); $(loader).append($("<a>",{ "class": "lb-cancel" }).append($("<img>",{ "src": this.options.fileLoadingImage }))); $(container).append(nav); $(container).append(loader); $(outerContainer).append(container); dataContainer = $("<div>",{ "class": "lb-dataContainer" }); data = $("<div>",{ "class": "lb-data" }); details = $("<div>",{ "class": "lb-details" }); $(details).append($("<span>",{ "class": "lb-caption" })); $(details).append($("<span>",{ "class": "lb-number" })); closeContainer = $("<div>",{ "class": "lb-closeContainer" }); $(closeContainer).append($("<a>",{ "class": "lb-close" }).append($("<img>",{ "src": this.options.fileCloseImage }))); $(data).append(details); $(data).append(closeContainer); $(dataContainer).append(data); $(lightBox).append(outerContainer); $(lightBox).append(dataContainer); $(lightBox).appendTo("body"); // End custom changes $('#lightBoxOverlay').hide().on('click',function(e) { _this.end(); return false; }); $lightBox = $('#lightBox'); $lightBox.hide().on('click',function(e) { if ($(e.target).attr('id') === 'lightBox') _this.end(); return false; }); $lightBox.find('.lb-outerContainer').on('click',function(e) { if ($(e.target).attr('id') === 'lightBox') _this.end(); return false; }); $lightBox.find('.lb-prev').on('click',function(e) { _this.changeImage(_this.currentImageIndex - 1); return false; }); $lightBox.find('.lb-next').on('click',function(e) { _this.changeImage(_this.currentImageIndex + 1); return false; }); $lightBox.find('.lb-loader,.lb-close').on('click',function(e) { _this.end(); return false; }); };