使用带有响应的InterImage链接的灯箱

Lightbox using InterImage Link with response

本文关键字：InterImage 链接 响应      更新时间：2023-09-26

我有一个响应，其中我存储了缩略图和原始图像，如下所示。

context.Response.Write("<a href='" + (tempPath & "/") + filename + "'><img src='" + (tempPath & "/thumbs/") + "t_" + filename + "'/></a>")

那么现在我如何添加Lightbox效果

这是我的Uploadify OnComplete事件:

<script type="text/javascript">
    $(window).load(
    function () {
        $("#Inputfile").fileUpload({
            'uploader': 'scripts/uploader.swf',
            'cancelImg': 'images/cancel.png',
            'buttonText': 'Browse Files',
            'script': 'UploadVB.ashx',
            'folder': 'uploads',
            'fileDesc': 'Image Files',
            'fileExt': '*.jpg;*.jpeg;*.gif;*.png',
            'queueSizeLimit': 9999,
            'simUploadLimit': 2,
            'sizeLimit': 4000000,
            'multi': true,
            'auto': true,
 'onComplete': function (event, queueID, fileObj, response, data) {
            var paths = response.split(";");
            $("#thumbnail").append(response)
              },
    });
}
);

这是我的DIV元素: 
<div id="thumbnail">
Here I am able to display the thumbnail image through which I called through the response and If I click the thumbnail it's opening the Image but not with the Lightbox effect.
</div>

添加响应后应该做的是设置灯箱效果。你也可以在#thumbnail中委托click事件，这样对于thumbnail中的每个在锚上完成的单击，该函数将被调用。然后你可以在灯箱中打开图像。

开始:

$('#thumbnail').delegate('a', 'click', function (e) {
    // open the href inside a lightbox
    e.preventDefault(); // to prevent opening the link
});
相关文章：