php文件中的javascript/css弹出div_Javascript_Php_Html_Css_Popup

php文件中的javascript/css弹出div

javascript php html css

php文件中的javascript/css弹出div,javascript,php,html,css,popup,Javascript,Php,Html,Css,Popup,我按照这个指南在我的首页上创建了一个弹出div 问题是我不太熟悉编码，我想把代码放在我的php文件中（这里是wordpress站点）。我不知道我是否可以在没有标签的情况下工作，因为我的文件不是html，所以我尝试在其中加入纯javascript。网站的css代码在我的wordpress网站的css样式文件中，当然js文件也在文件夹中！这就是我被卡住的地方： <script type="text/javascript" src="css-pop.js"></script>

我按照这个指南在我的首页上创建了一个弹出div

问题是我不太熟悉编码，我想把代码放在我的php文件中（这里是wordpress站点）。我不知道我是否可以在没有标签的情况下工作，因为我的文件不是html，所以我尝试在其中加入纯javascript。网站的css代码在我的wordpress网站的css样式文件中，当然js文件也在文件夹中！这就是我被卡住的地方：

<script type="text/javascript" src="css-pop.js"></script>
<script type="text/javascript">
function popup() {
document.getElementById("popUpDiv").style.display = "block";
}
window.onload=function popup();
</script>

<div id="blanket" style="display:none"></div>
<div id="popUpDiv" style="display:none"></div>


函数popup（）{
document.getElementById（“popUpDiv”）.style.display=“block”；
}
window.onload=函数popup（）；

有人能告诉我正确的代码，这样我就可以工作了吗？谢谢

尝试替换

window.onload=function popup();

与

你可以在

试试这个。它会起作用的。

首先，最好的办法是创建一个模式弹出窗口，理论上，它是一个隐藏的div，可以在事件中显示。这将是一个简单的div，您可以使用任何您想要的工具来实现它。我可以想象你想要一个以文档为中心的弹出窗口。要做到这一点，在body标记后面创建一个div，并在其中添加一点css，将绝对位置置于文档弹出窗口的中心，并在顶部和左侧添加属性，z-index要在页面上显示pup，该值必须是样式表的最大z-index。然后，显示onload事件弹出窗口的javascript代码：

<html>
 <head>
   <title>Title of the document</title>
 </head>
<body>

<div id="popUp" style="display:none;z-index:10;position:absolute;top:50%;left:50%;">
 //Put the pop up content here
</div>

 //Your other elements

<script type="text/javascript">
window.onload = function (){showPopup();};
function showPopup()
{
    document.getElementById("popUp").style.display = "block";
}
</script>
</body>


文件标题
//将弹出内容放在这里
//你的其他元素
window.onload=函数（）{showPopup（）；}；
函数showPopup（）
{
document.getElementById（“弹出”）.style.display=“块”；
}

我猜您可能还在css-pop.js文件中使用了

window.onload

<代码>窗口。onload仅支持该类型的一个事件，并且每次使用它时，它将使用该事件的最新事件。在您的情况下，如果css-pop.js中有

window.onload

，它将不起作用。我建议使用jquery

$（document.ready（function（）{//code here}）

或在此处查看如何修改

窗口。onload

function popup() {
    document.getElementById("popUpDiv").style.display = "block";
}
window.onload = function() {
    popup();
}

<html>
 <head>
   <title>Title of the document</title>
 </head>
<body>

<div id="popUp" style="display:none;z-index:10;position:absolute;top:50%;left:50%;">
 //Put the pop up content here
</div>

 //Your other elements

<script type="text/javascript">
window.onload = function (){showPopup();};
function showPopup()
{
    document.getElementById("popUp").style.display = "block";
}
</script>
</body>