jquery设置弹窗效果

添加一个用于弹窗的div

 <div id="pic-content">
            <div id="popdiv" style="display:none">
                <h2>图片<a href="#" class="close">关闭</a></h2>
                <div class="div-content"></div>
            </div>
            <div class="tablecontent"></div>
            <div id="Page"></div>
        </div>

如图：

当点击img_1.jpg时，

$(".show-pic").live('click', function() {
    var path = "../../WebImages/Wall/" + $("#type-select option:selected").val() + "/" + $(this).text();
    $(".div-content").html("<img class='showpic' src='"+path+"'/>");
    $("#popdiv").css("top", "200px");
    $("#popdiv").css("display", "block");
    document.documentElement.scrollTop = 0;
});

效果如下：

关闭事件

    $(".close").click(function() {
        $("#popdiv").css("display", "none");
    });