1

（对不起我的英语不好）

我有一个弹出窗口（如 facebook 上的通知）。我希望它在单击页面的其余部分后隐藏。

剂量按原样工作。

你能帮助我吗？

代码：

<div id="login">
...
</div>

CSS：

#login {
background-color:@windows;
position:absolute;
width:413px;
height:190px;
z-index:110;
left:-189px;
top:43px;
overflow:visible;
line-height:normal;
display:none;
}

要显示弹出窗口，我使用 jquery fadeIn

JS：

    var active="";

function show_window(window) {
    hide_active_window();

    if(active==window) {
        active="";
        return;
    }

    active = window;

    $('#'+window).fadeIn(200);

    switch(window) {
        case 'login':
            $('#login_button').addClass("active");
            break;

    }
}

function hide_active_window() {
    if(active=="") return;

    $('#'+active).fadeOut(200);

    switch(active) {
        case 'login':
            $('#login_button').removeClass("active");
            break;

    }

}
4

2 回答 2

0 
<html>
<head>
</head>
<body >
<div id="popup">My Popup</div>
<div id="restOfThePage" onClick="document.getElementById('popup').style.display='none';">Rest of the page</div>
</body>

</html>

演示

于 2013-07-24T05:20:47.033 回答
0

试试下面的 JsFiddle

http://jsfiddle.net/arunberti/tY82H/

希望这是你的答案

jQuery

$(document).mouseup(function (e)
{
    var container = $("#login");

    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});
于 2013-07-24T05:21:17.603 回答