12小时后仍然试图找出如何在关闭时删除点击的图库图像。实例here。麻烦的是当在图库中点击缩略图时,拇指的'src'图像会转移到下一个图库。尝试了数百种方法去除,但不要以为我是近在咫尺,noobie。最后几行javascript可以在这里看到 http://jsfiddle.net/coryd3033/5LPqZ/ 只需在下一个图库中一起删除图像持有者,而不是上一个图库中的最后一个图像。任何想法将不胜感激。谢谢。我正在寻找的功能是在关闭时简单地从支架上移除图像。虽然不是那么简单:(
答案 0 :(得分:0)
示例:
$('.close').click(function() {
$('.imageHolder').fadeOut(500, function(){
$('.imageHolder img').remove();
});
});
这意味着:单击关闭按钮时,会在半秒内淡出图像支架。完成后,从图像持有者中删除任何图像。
希望有所帮助。
答案 1 :(得分:0)
你的代码非常混乱。我能说的最好,问题不在于<img/>
src,而在于#largephotoc1
的{{1}}属性。打开模态后,您需要调用background-image
函数将loadPhoto()
的背景图像设置为集合中的第一张图像。
答案 2 :(得分:0)
谢谢Chimoo和Set Sail(至少在你的缩进后我清理了我的代码,而不是我的评论)。这给了我所需的功能,一切都很完美。不知道怎么样,逻辑上没有意义。
但有什么方法可以简化这个块。它基本上执行类似任务的三个功能。但它的工作原理:)
谢谢你们。
function loadDefault($lD, $caption){
showPreloader();
var img = new Image();
$(img).load( function()
{
$(img).hide();
hidePreloader();
}).attr({ "src": $lD });
$('#largephoto').css('background-image','url("' + $lD + '")');
$('#largephoto').data('caption', $caption);
$('#largephotoc1').css('background-image','url("images/album/modallarge/c1.1.jpg")');
$('#largephotoc1').data('caption', $caption);
$('#largephotoc2').css('background-image','url("images/album/modallarge/c3.1.jpg")');
$('#largephotoc2').data('caption', $caption);
$('#largephotoc3').css('background-image','url("images/album/modallarge/c4.1.jpg")');
$('#largephotoc3').data('caption', $caption);
$('#largephoto3d1').css('background-image','url("images/album/modallarge/3d1.1.jpg")');
$('#largephoto3d1').data('caption', $caption);
}
$('.reveal-modal').ready(function(){
//var source = $('.st_thumbs').click
var handler = $(this).find('.large_image');
var newsrc = handler.attr('src');
var newcaption = handler.attr('rel');
loadDefault(newsrc, newcaption);
});
function loadPhoto($url, $caption){
showPreloader();
var img = new Image();
$(img).load( function()
{
$(img).hide();
hidePreloader();
}).attr({ "src": $url });
$('#largephotoc1').css('background-image','url("' + $url + '")');
$('#largephotoc1').data('caption', $caption);
$('#largephotoc2').css('background-image','url("' + $url + '")');
$('#largephotoc2').data('caption', $caption);
$('#largephotoc3').css('background-image','url("' + $url + '")');
$('#largephotoc3').data('caption', $caption);
$('#largephotoc4').css('background-image','url("' + $url + '")');
$('#largephotoc4').data('caption', $caption);
$('#largephoto3d1').css('background-image','url("' + $url + '")');
$('#largephoto3d1').data('caption', $caption);
}
$('.thumb_container').click(function()
{
//var source = $('.st_thumbs').click
var handler = $(this).find('.large_image');
var newsrc = handler.attr('src');
var newcaption = handler.attr('rel');
loadPhoto(newsrc, newcaption);
});
function removePhoto($lD, $caption){
showPreloader();
var img = new Image();
$(img).load( function()
{
$(img).hide();
hidePreloader();
}).attr({ "src": $lD });
$('#largephotoc1').css('background-image','url("images/album/modallarge/c1.1.jpg")');
$('#largephotoc1').data('caption', $caption);
$('#largephotoc2').css('background-image','url("images/album/modallarge/c3.1.jpg")');
$('#largephotoc2').data('caption', $caption);
$('#largephotoc3').css('background-image','url("images/album/modallarge/c4.1.jpg")');
$('#largephotoc3').data('caption', $caption);
$('#largephoto3d1').css('background-image','url("images/album/modallarge/3d1.1.jpg")');
$('#largephoto3d1').data('caption', $caption);
}
$('.close-reveal-modal').click(function()
{
//var source = $('.st_thumbs').click
var handler = $(this).find('.large_image');
var newsrc = handler.attr('src');
var newcaption = handler.attr('rel');
removePhoto(newsrc, newcaption);
});