Question

我点击其中任何一个图像时会出现中等大小的图像，点击中等大小时应使用漂亮的照片加载大尺寸，但点击任何小照片后加载中等图像然后单击edium图像，prettyphoto不起作用，较大的图像将作为链接打开

$(document).ready(function(e) { 

$(document).on("click",".image a",function(){
    var num = $(this).parent().index()+1;
    $(".bottom").slideUp(500,',function(){
        $(".bottom").html("<a rel='prettyPhoto' href='images/"+num+"_large.jpg'><img src='images/"+num+"_med.jpg'></a>").slideDown(500);    
    });
});

$("a[rel='prettyPhoto']").prettyPhoto();
});

HTML

<div class="container">

<div class="top">
<div class="image"><img src="images/1.jpg"  alt=""/></div>
<div class="image"><img src="images/2.jpg"  alt=""/></div>
<div class="image"><img src="images/3.jpg"  alt=""/></div>
</div>

<div class="bottom">
<a href="images/1_large.jpg" rel="prettyPhoto"><img src="images/1_med.jpg" width="640" height="480"  alt=""/></a>
</div>

</div>

下载http://www.mediafire.com/?xd97aonsjz3oyc0

的完整代码

和http://jsfiddle.net/frTAY/3/

Answer 1

您遇到语法错误。这是正确的代码：

$(document).on("click",".image a",function(){
    var num = $(this).parent().index()+1;
    $(".bottom").slideUp(500,function(){
        $(".bottom").html("<a rel='prettyPhoto' href='images/"+num+"_large.jpg'><img src=images/"+num+"_med.jpg></a>").slideDown(500);  
    });
});

prettyphoto不使用未加载DOM的链接

1 个答案: