我正在使用以下javascript在客户网站上显示页面加载时的弹出消息。我是js的真正新手,只能真正复制/粘贴我在网上找到的例子。需要知道如何设置弹出框的宽度。我希望文本可以运行两行,而不仅仅是跨越页面的宽度。以下是www.manageourwebsite.com.au
的示例<body onload="WelcomeMSG()">
<script language="JavaScript">
<!--
function WelcomeMSG ()
{
alert("Our Retail shop front will be closed from Friday 21st December 2012 thru to Monday 21st January 2013. The Online store will be open 24/7 as usual with all online orders being processed as normal.")
}
-->
</script>
答案 0 :(得分:1)
我会用一点CSS(根据你自己喜欢的方式设置)和一行javascript来实现它
<style type="text/css">
#holiday-overlay{
position:fixed;
top:0; left:0; right:0; bottom:0;
background: rgba(255,255,255,0.7);
z-index:9999;
}
#holiday-message{
width:400px;
padding:30px;
background-color: black;
left:50%;
top:40%;
margin-left:-200px; /*half of width*/
border-radius:5px;
color:white;
position:relative;
}
#holiday-close{
paddding:5px;
position:absolute;
right:10px;
top:10px;
cursor:pointer;
font-weight:bold;
color:white;
}
</style>
<div id="holiday-overlay">
<div id="holiday-message">
<a onclick="var el = document.getElementById('holiday-overlay'); el.parentNode.removeChild(el)" id="holiday-close">×</a>
Our Retail shop front will be closed from Friday 21st December 2012 thru to Monday 21st January 2013.<br/>
The Online store will be open 24/7 as usual with all online orders being processed as normal.
</div>
</div>
演示
答案 1 :(得分:1)
对于初学者来说,你无法真正编辑alert
框的宽度。请看这里有关此的类似问题:
how to change the style of alert box
当然,你可以做一些像\n
这样的hackish,但是仍然没有给你你可以定制的定制。我强烈建议您使用自己设置的div
制作自己的警报框并手动编写javascript,以便它像警报一样弹出。 看看@Gaby aka G. Petrioli的回答如下。他有一个很好的例子。你也可以尝试使用一些为你做的API。
jQuery dialog是其中之一,但为了让你了解它是如何工作的(因为它似乎你是新手)jQuery为你做了大部分的工作 - 你真正需要做的就是{{1将他们的javascript文件放入您的代码中,然后相应地调用它。您可以查看他们为您提供的一些功能here。具体来说,我将你链接到minWidth部分,因为我相信这是你正在寻找的东西。
如果您对如何使用jQuery有疑问或感到困惑,请随时在此处发表评论。我们希望看到人们尝试在Stackoverflow上编码,所以不要害羞地提出问题(只是确保你在发帖前要求好的和研究)。我们都是新手 - 我们成为专家的方式是通过应用和实验。
答案 2 :(得分:0)
如果您希望将文本换行到两行,我建议在文本中的所需位置添加\ n换行符:
alert("Hello\nWorld")