当鼠标按钮的指针尝试关闭弹出窗口时,阴影弹出框消失

Shadow popup box disappear when pointer of the mouse button try to close the popup

本文关键字:窗口 阴影 消失 按钮 鼠标 指针      更新时间:2023-09-26

请原谅我,因为我在使用javascript方面不是很有经验。我有wordpress网站,我想找到方法并帮助我创建带有关闭按钮的阴影弹出框,当访问者用鼠标指针尝试单击关闭按钮X之前单击阴影弹出框以消失/关闭一次。但是,我也希望弹出窗口不会在同一访问者上显示两次以上。阴影弹出框,每天显示一次或两次。Cookie 时间将在 24 小时后自动删除,并且同一访问者在 24 小时后再次看到弹出窗口。我希望有人能帮助我。

谢谢。

查看带有关闭和打开的简单弹出窗口

<div class="cover"></div>
<div class="popup">
    <button class="close">x</button>
</div>
<button class="open">click me</button>

和 jquery

$(".open").click(function () {
    $(".popup").fadeIn(500);
    $(".cover").fadeTo(500, 0.5);
});
$(".close").click(function () {
    $(".popup").fadeOut(500);
    $(".cover").fadeOut(500);
});

.CSS

.popup {
    position:fixed;
    border:solid 1px black;
    width:200px;
    height:200px;
    left:50%;
    top:50%;
    margin:-100px 0 0 -100px;
    display:none;
    background-color:white;
}
.cover {
    background-color:black;
    width:100%;
    height:100%;
    display:none;
    position:fixed;
}

工作示例 http://jsfiddle.net/ayx90k5c/

编辑的安斯http://jsfiddle.net/ayx90k5c/7/

谢谢。