使用jquery中的X符号关闭load()页面的最有效方法

Question

我是Jquery的新手，我正在尝试使用div容器加载URL，但是，我想给用户一个选项，让用户可以像在Amazon.com中那样在右上角用X号关闭它。实现这一点的最佳方法是什么？

这是我所拥有的，似乎很难弄清楚右上角在哪里，并放置图像X:

$("#url_link_details").click(function() {
    $("#details").load("tooltip_address.htm", function() {
        $(this).addClass("openwindow").show();
        $(".img_close").addClass("img_close_show").show();
    })
});

感谢您的帮助。

Answer 1

一些html:

<div id="popup">
    <img src="x.gif" alt="Close" class="img_close" />
    <div class="details"></div>
</div>

一些css：

#popup .img_close {
    float: right;
}
#details {
    clear: right; /* if you want there to be a "titlebar" area */
}

一些jQuery

$('#url_link_details").click(function() {
    $('#details').load('tooltip_address.htm', function() {
        $('#popup')
            .show()
            .find('.img_close')
            .click(function() {
                $('#popup').hide();
            })
        ;
    })
})