0

我有一个问题。我想在网页上有两个内联 javascript 弹出窗口。这是javascript：

<script type="text/javascript">
    var popup;
    Sys.require(Sys.components.popup, function () {
        popup = Sys.create.popup("#popup", {
            parentElementID: "target"
        });
    });
    var popup2;
    Sys.require(Sys.components.popup, function () {
        popup2 = Sys.create.popup("#popup2", {
            parentElementID: "target"
        });
    });
</script>

这是页面的内容：

content
<span id="target" style="position: absolute; top: 50%; left: 40%; margin-top: -125px; margin-left: -200px;"></span>
<div id="popup" style="background: #ff6a00; color: #000; padding: 15px; margin: 0px">
    Popup #1
</div>
<div id="popup2" style="background: #ffd800; color: #000; padding: 15px; margin: 0px">
    Popup #2
</div>
content
<script>Sys.onReady(function () { popup.show(); })</script>
<script>Sys.onReady(function () { popup2.show(); })</script>

两个弹出窗口都针对页面上的相同位置。所以我希望第二个与第一个重叠。第一个弹出窗口正确弹出。第二个实际上出现在页面中，根本没有弹出。如您所见，页面上的内容正在围绕它进行：

在此处输入图像描述

为什么会发生这种情况，我该如何解决？

4

0 回答 0