超链接在弹出窗口中不起作用

Hyperlink not working on popup

本文关键字：不起作用 窗口 超链接      更新时间：2023-09-26

我在这里有一个网站。

页面一加载就会出现一个弹出窗口。但是，我无法使用HTML内容中的链接。

这是HTML

<body onload="popup('popUpDiv')">
<div id="blanket" style="display:none"></div>
<div id="popUpDiv" style="display:none">
<a href="#" onclick="popup('popUpDiv')" ><img src="images/x.png" /></a>
        <br />
    <h3 style="color: #FFF; padding-left: 10px;">Updates to the AR Toolbox</h3>
            <br />
                <br />
                <div style="width: 350px; height: 300px; text-align: left;">
                <p style="padding-left: 50px; color: #000;">• Check out the new rotating Announcement Board on the AR Toolbox!</p>
                    <br />
                <p style="padding-left: 50px; color: #000;">• Have you seen the new SUO Tour yet? Click <a href="#" target="_blank">here</a> to check it out!</p>                
                    <br />
                <p style="padding-left: 50px; color: #000;">• South University and The Education Foundation Scholarship Committee are now on SharePoint. Click <a href="#" target="_blank"> here!</a></p>
                    <br />
        </div>
</div>

当你看到弹出窗口时，你会看到我的所有链接都被分组在弹出窗口的右上角，带有"X"。

这是弹出菜单的CSS

#blanket {
   background-color:#111;
   opacity: 0.65;
   filter: alpha(opacity=65)
   *background:none;
   position:absolute;
   z-index: 9001;
   top:0px;
   left:0px;
   width:100%;
}
#popUpDiv {
    position:absolute;
    background-color: #fff;
    background-image:url(../images/popup_bg.png);
    background-repeat:no-repeat;    
    width:400px;
    height:400px;
    border:5px solid #000;
    z-index: 9002;
}

#popUpDiv a {
    background-image: url(../images/x.png); 
    background-repeat: no-repeat;
    position:absolute; top:10px; right:10px}

我认为它位于"#popUpDiv a"部分，但我不确定如何修复它。

有什么想法吗？

编辑：这是jsfiddle

在第二个项目符号上，您将看到"点击查看！"而应该是"点击此处查看！"

在第三个项目符号上，您将看到"点击"，而它应该是"点击此处"

但是，由于某种原因，所有的链接都被捆绑在右上角。

与其将样式应用于a，不如创建一个样式类并将其应用于popUpDiv。像这样。。。

#popUpDiv .close {
    background-image: url(../images/x.png); 
    background-repeat: no-repeat;
    position:absolute; 
    top:10px; 
    right:10px
}

并将其应用于CCD_ 3。。。

<a href="#" onclick="popup('popUpDiv')" class="close"><img src="images/x.png" /></a>

jsFiddle演示此处

希望这能有所帮助！

相关文章：