Question

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

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>

Answer 1

添加响应后您应该做的是设置灯箱效果。您还可以在#thumbnail中委派click事件，以便对于在锚点上完成的缩略图中的每次单击，都将调用该函数。然后，您可以在灯箱中打开图像。

让你入门：

$('#thumbnail').delegate('a', 'click', function (e) {

    // open the href inside a lightbox

    e.preventDefault(); // to prevent opening the link
});

Lightbox使用InterImage Link和响应

1 个答案: