添加指向交换图像的链接

时间:2008-12-22 16:25:53

标签: jquery

我有一个交换图像的图像库,我想将交换的图像链接到阴影框/灯箱中更大的图像。我很接近,我正在研究如何添加链接。它会在我现在弹出警报框的地方。如果您想查看到目前为止的页面,请点击以下页面:http://site.jpda.biz/projects/boerum-hill-house

我认为这很简单,但我刚刚碰到它。 TIA。

function showImage(src)
{
$("#loader img").fadeOut("slow")
            .remove();

var largeImage = new Image();

$(largeImage).attr("src", src)
         .attr("id", "main")
         .load(function()
            {
            $(largeImage).hide();
            $("#loader").removeClass("loading")
                        .append(largeImage);
            $(largeImage).fadeIn("slow");
            $("#loader img").click(function()
                    {
                    alert("Launch Shadowbox here");
                    });
            }); 

更新11/23

根据Tricks的反应,我找到了一个很好的方法来纠正我遇到的问题。我从他的解决方案开始(构建一个新的DIV),这使我进入了我现在使用的wrap函数。我能够使用wrap函数而不必构建整个DIV。这是我更新的代码(包括传递链接标题的功能)。

function showImage(src,tit)
{
$("#loader img").fadeOut("slow")
            .remove();
$("#loader a").remove();


var largeImage = new Image();
var largePath = "/files/imagecache/project_large/" + src;
var largeLink = "<a rel='shadowbox' title='" + tit + "' href='/files/" + src + "'></a>";

$(largeImage).attr("src", largePath)
     .attr("id", "main")
     .attr("border", "0")
         .load(function()
            {           
            $(largeImage).hide();

            $("#loader").removeClass("loading")
                    .append(largeImage);
            $("#main").wrap(largeLink);
            $(largeImage).fadeIn("slow");
            });              
}

1 个答案:

答案 0 :(得分:1)

你想要做的事实上是交换div而不仅仅是img标签,并且使用链接围绕要交换的图像生成div。