高手帮忙看看,以下代码为什么不会出现 "遮罩层"? 在加载网页之前，设置一个 "遮罩层"，可却没有出现！
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html" charset="gb2312">
<meta http-equiv="progma" content="on-cache">
<meta name="robots" content="all">
<meta name="keywords" content="关键字">
<title>javascript的测试</title>
<script type="text/javascript" lengauge="javascript">
function hanshu2() //表单提交事件
{
var x=document.myform.elements.length;
{
for(y=0; y<x-2; y++)
{
if (document.myform.elements[y].value.length==0 || document.myform.elements[y].value.length<=5)
{
alert("第"+(y+1)+"个文本框不能为空,"+"\n字符数不能少于5个!");
return false;
}
} } }
function hanshu()
{
mydiv.style.display="none";
}
</script>
<style type="text/css">
div{width:800px; height:800px; margin-top:10px; margin-left:auto; margin-right:auto; border-color:red; border-width:1px;
border-style:inset}
#div1{width:300px; height:150px; float:left; margin-top:0px; margin-right:auto; background-color:#46a3ff}
#div2{width:300px; height:150px; float:right; margin-left:auto; margin-top:0px; background-color:#66b3ff}
.div3{width:190px; height:150px; margin-left:auto; margin-right:auto; float:none; margin-top:0px}
</style>
</head>
<body onload="hanshu()">
<div> <!--父容器-->
<div id="div1"> <!--左div-->
<form name="myform" onsubmit="return hanshu2()" action="x.html">
用户:<input type="text" name="mytext1" size="16" /><font size="2">(用户名可为汉字，字母，英文。字符数不能少于5个!)</font><br />
密码:<input type="password" name="mypassword1" size="16" /><font size="2" color="red">(密码可为数字，符号，单词，字符数不能少于5个!)</font><br />
邮箱:<input type="text" name="myemail" size="16" /><br>
<input type="submit" name="mysubmit" value="提交" /> <input type="reset" name="myreset" value="重置" />
</form>
</div>
<div id="div2"> <!--右div-->
<h2>为空</h2>
</div>
<div class="div3"> <!--居中div-->
<img src="e:\469b25ec3e07fe2c62d09f01.jpg" width="190" height="150" />
</div>
</div>
<div style="width:1000px; height:1000px; background-color:#ffffff" position:absolute;top:0px;left:0px" id="mydiv">
<font size="2" color="red"><em>正在加载网页，请稍等……</em></font>
</div>
<!--<script type="text/javascript" lengauge="javascript">
{
alert("请点击确认,进入网页!");
}
</script> -->
</body>
</html> 展开
<html>
<head>
<meta http-equiv="content-type" content="text/html" charset="gb2312">
<meta http-equiv="progma" content="on-cache">
<meta name="robots" content="all">
<meta name="keywords" content="关键字">
<title>javascript的测试</title>
<script type="text/javascript" lengauge="javascript">
function hanshu2() //表单提交事件
{
var x=document.myform.elements.length;
{
for(y=0; y<x-2; y++)
{
if (document.myform.elements[y].value.length==0 || document.myform.elements[y].value.length<=5)
{
alert("第"+(y+1)+"个文本框不能为空,"+"\n字符数不能少于5个!");
return false;
}
} } }
function hanshu()
{
mydiv.style.display="none";
}
</script>
<style type="text/css">
div{width:800px; height:800px; margin-top:10px; margin-left:auto; margin-right:auto; border-color:red; border-width:1px;
border-style:inset}
#div1{width:300px; height:150px; float:left; margin-top:0px; margin-right:auto; background-color:#46a3ff}
#div2{width:300px; height:150px; float:right; margin-left:auto; margin-top:0px; background-color:#66b3ff}
.div3{width:190px; height:150px; margin-left:auto; margin-right:auto; float:none; margin-top:0px}
</style>
</head>
<body onload="hanshu()">
<div> <!--父容器-->
<div id="div1"> <!--左div-->
<form name="myform" onsubmit="return hanshu2()" action="x.html">
用户:<input type="text" name="mytext1" size="16" /><font size="2">(用户名可为汉字，字母，英文。字符数不能少于5个!)</font><br />
密码:<input type="password" name="mypassword1" size="16" /><font size="2" color="red">(密码可为数字，符号，单词，字符数不能少于5个!)</font><br />
邮箱:<input type="text" name="myemail" size="16" /><br>
<input type="submit" name="mysubmit" value="提交" /> <input type="reset" name="myreset" value="重置" />
</form>
</div>
<div id="div2"> <!--右div-->
<h2>为空</h2>
</div>
<div class="div3"> <!--居中div-->
<img src="e:\469b25ec3e07fe2c62d09f01.jpg" width="190" height="150" />
</div>
</div>
<div style="width:1000px; height:1000px; background-color:#ffffff" position:absolute;top:0px;left:0px" id="mydiv">
<font size="2" color="red"><em>正在加载网页，请稍等……</em></font>
</div>
<!--<script type="text/javascript" lengauge="javascript">
{
alert("请点击确认,进入网页!");
}
</script> -->
</body>
</html> 展开
1个回答
展开全部
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN ;
html xmlns= ;
head
titleTipsWindown Demo By [Await]/title
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
meta http-equiv="Content-Language" content="zh-CN" /
meta name="Keywords" content="" /
meta name="Description" content="" /
link rel=stylesheet href= ; type=text/css media=all /
script type=text/javascript src= ;/script
script type=text/javascript src= ;/script
style type="text/css"
body {
font: 12px 'Microsoft Yahei',arial,SimSun,sans-serif;
margin: 0 auto;
padding: 0px;
text-align: center;
color: #555;
background: #fff;
}
h1,h2,h3,h4,h5,h6,div,p,ul,ol,dl,dd,dt,abbr,form,input,img { margin: 0; padding: 0; }
img { border: none; }
h1 { width: 100%; text-align: center;}
a { color: #096FB7; text-decoration: none; }
a:hover { text-decoration: underline; }
#container { margin: 0 auto; margin-top: 20px; padding: 20px; width: 600px; text-align: left; border: 20px solid #DDD; }
h3{ margin: 10px 0;}
ol li { list-style: ; margin: 20px 0 0 50px; }
blockquote { width: 500px; margin: 10px 0; padding: 10px; border: 2px dashed #F8B3D0; background-color: #FFF5FA;}
/style
script type="text/javascript"
$(document).ready(function() {
$("#text1").click(function() {
tipsWindown("标题","text:提示信息内容","250","150","true","","true","text")
});
$("#text2").click(function() {
tipsWindown("标题","text:我不能拖动，而且还没遮罩背景","250","150","false","","showbg","text")
});
$("#text3").click(function() {
tipsWindown("标题","text:我不能拖动，但3秒钟后我会自动消失","250","150","false","3000","false","text")
});
$("#id1").click(function() {
tipsWindown("标题","id:testID","350","150","true","","true","id")
});
$("#img1").click(function() {
tipsWindown(图片,img: ;,500,230,true,,true,img)
});
$("#url1").click(function(){
tipsWindown("标题","url:get?test.html","250","150","true","","true","text");
});
$("#iframe1").click(function(){
tipsWindown(标题,iframe: ;,950,527,true,,true,leotheme);
});
});
/script
/head
body
div id="container"
h1TipsWindown 1.0/h1
h3关于插件：/h3
p一个基于jQuery的弹出层。支持拖拽，支持内容为文字，图片，URL等!至于兼容性。在IE6下，弹出对像无法绝对固定。其他应该没啥大问题；/p
h3应用演示：/h3
ol
li
弹出文本信息提示： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","true","","true","msg")/blockquote
button id="text1"点击我弹出提示/button
/li
li
弹出页面中的某个ID的html： br /
blockquotetipsWindown("标题","id:testID","300","200","true","","true","id")/blockquote
button id="id1"点击我弹出提示/button
div id="testID" style="display: none"
p我是测试ID里的内容/p br /
我换行了...
/div
/li
li
弹出图片： br /
blockquotetipsWindown("图片","img:图片路径","250","150","true","","true","img")/blockquote
button id="img1"点击我弹出提示/button
/li
li
get加载一个.html文件（也可以是.php/.asp?id=4之类的）： br /
blockquotetipsWindown("标题","url:get?test.html","250","150","true","","true","text"); /blockquote
button id="url1"点击我弹出提示/button
/li
li
加载一个页面到框架显示：br /
blockquotetipsWindown(标题,iframe: ;,900,580,true,,true,leotheme); /blockquote
button id="iframe1"点击我弹出提示/button
/li
li
弹出一个不能拖动且没有遮罩背景的文本信息层： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","false","","false","msg")/blockquote
button id="text2"点击我弹出提示/button
/li
li
弹出一个不能拖动，三秒钟自动关闭的层： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","false","3000","true","msg")/blockquote
button id="text3"点击我弹出提示/button
/li
/ol
h3参数说明：/h3
table width="0" border="1" cellpadding="5" cellspacing="0"
tr
th scope="col"顺序/th
th scope="col"参数/th
th scope="col"功能/th
th colspan="2" scope="col"备注/th
/tr
tr
th scope="row"1/th
th scope="row"title/th
td弹出层的标题/td
td colspan="2"必填，纯文本/td
/tr
tr
th rowspan="5" scope="row"2/th
th rowspan="5" scope="row"content/th
td rowspan="5"弹出层的内容/td
tdtext/td
td文本内容/td
/tr
tr
tdid/td
td页面里某id的子标签/td
/tr
tr
tdimg/td
td图片/td
/tr
tr
tdurl/td
tdget或post某一页面里的html，该页面要求只包含body的子标签/td
/tr
tr
tdiframe/td
td目标地址在框架显示/td
/tr
tr
th scope="row"3/th
th scope="row"width/th
td弹出层的宽/td
td colspan="2"必填，比如“200”。（不需要带px）/td
/tr
tr
th scope="row"4/th
th scope="row"height/th
td弹出层的高/td
td colspan="2"同 width/td
/tr
tr
th scope="row"5/th
th scope="row"drag/th
td是否可拖动/td
td colspan="2"必填，可选参数（true,false）/td
/tr
tr
th scope="row"6/th
th scope="row"time/th
td自动消失时间/td
td colspan="2"可不填，默认不自动关闭；参数可为空(quot;quot;)/td
/tr
tr
th scope="row"7/th
th scope="row"showbg/th
td是否显示遮罩层/td
td colspan="2"可不填，默认不显示（此项如填了，它前面的time也必须要填）/td
/tr
tr
th scope="row"8/th
th scope="row"cssName/th
td弹出层附加样式名/td
td colspan="2"可不填/td
/tr
/table
h3相关下载：/h3
pa href= ; title=JS文件下载JS文件下载/a | a href= ; title=完整包下载完整包下载/a/p
p style=float: right;最后更新日期：2009-11-24 By a href= ; title=AwaitAwait/abr //p
p style="clear: both;"/p
/div
br /
/body
/html
html xmlns= ;
head
titleTipsWindown Demo By [Await]/title
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
meta http-equiv="Content-Language" content="zh-CN" /
meta name="Keywords" content="" /
meta name="Description" content="" /
link rel=stylesheet href= ; type=text/css media=all /
script type=text/javascript src= ;/script
script type=text/javascript src= ;/script
style type="text/css"
body {
font: 12px 'Microsoft Yahei',arial,SimSun,sans-serif;
margin: 0 auto;
padding: 0px;
text-align: center;
color: #555;
background: #fff;
}
h1,h2,h3,h4,h5,h6,div,p,ul,ol,dl,dd,dt,abbr,form,input,img { margin: 0; padding: 0; }
img { border: none; }
h1 { width: 100%; text-align: center;}
a { color: #096FB7; text-decoration: none; }
a:hover { text-decoration: underline; }
#container { margin: 0 auto; margin-top: 20px; padding: 20px; width: 600px; text-align: left; border: 20px solid #DDD; }
h3{ margin: 10px 0;}
ol li { list-style: ; margin: 20px 0 0 50px; }
blockquote { width: 500px; margin: 10px 0; padding: 10px; border: 2px dashed #F8B3D0; background-color: #FFF5FA;}
/style
script type="text/javascript"
$(document).ready(function() {
$("#text1").click(function() {
tipsWindown("标题","text:提示信息内容","250","150","true","","true","text")
});
$("#text2").click(function() {
tipsWindown("标题","text:我不能拖动，而且还没遮罩背景","250","150","false","","showbg","text")
});
$("#text3").click(function() {
tipsWindown("标题","text:我不能拖动，但3秒钟后我会自动消失","250","150","false","3000","false","text")
});
$("#id1").click(function() {
tipsWindown("标题","id:testID","350","150","true","","true","id")
});
$("#img1").click(function() {
tipsWindown(图片,img: ;,500,230,true,,true,img)
});
$("#url1").click(function(){
tipsWindown("标题","url:get?test.html","250","150","true","","true","text");
});
$("#iframe1").click(function(){
tipsWindown(标题,iframe: ;,950,527,true,,true,leotheme);
});
});
/script
/head
body
div id="container"
h1TipsWindown 1.0/h1
h3关于插件：/h3
p一个基于jQuery的弹出层。支持拖拽，支持内容为文字，图片，URL等!至于兼容性。在IE6下，弹出对像无法绝对固定。其他应该没啥大问题；/p
h3应用演示：/h3
ol
li
弹出文本信息提示： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","true","","true","msg")/blockquote
button id="text1"点击我弹出提示/button
/li
li
弹出页面中的某个ID的html： br /
blockquotetipsWindown("标题","id:testID","300","200","true","","true","id")/blockquote
button id="id1"点击我弹出提示/button
div id="testID" style="display: none"
p我是测试ID里的内容/p br /
我换行了...
/div
/li
li
弹出图片： br /
blockquotetipsWindown("图片","img:图片路径","250","150","true","","true","img")/blockquote
button id="img1"点击我弹出提示/button
/li
li
get加载一个.html文件（也可以是.php/.asp?id=4之类的）： br /
blockquotetipsWindown("标题","url:get?test.html","250","150","true","","true","text"); /blockquote
button id="url1"点击我弹出提示/button
/li
li
加载一个页面到框架显示：br /
blockquotetipsWindown(标题,iframe: ;,900,580,true,,true,leotheme); /blockquote
button id="iframe1"点击我弹出提示/button
/li
li
弹出一个不能拖动且没有遮罩背景的文本信息层： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","false","","false","msg")/blockquote
button id="text2"点击我弹出提示/button
/li
li
弹出一个不能拖动，三秒钟自动关闭的层： br /
blockquotetipsWindown("提示","text:提示信息内容","250","150","false","3000","true","msg")/blockquote
button id="text3"点击我弹出提示/button
/li
/ol
h3参数说明：/h3
table width="0" border="1" cellpadding="5" cellspacing="0"
tr
th scope="col"顺序/th
th scope="col"参数/th
th scope="col"功能/th
th colspan="2" scope="col"备注/th
/tr
tr
th scope="row"1/th
th scope="row"title/th
td弹出层的标题/td
td colspan="2"必填，纯文本/td
/tr
tr
th rowspan="5" scope="row"2/th
th rowspan="5" scope="row"content/th
td rowspan="5"弹出层的内容/td
tdtext/td
td文本内容/td
/tr
tr
tdid/td
td页面里某id的子标签/td
/tr
tr
tdimg/td
td图片/td
/tr
tr
tdurl/td
tdget或post某一页面里的html，该页面要求只包含body的子标签/td
/tr
tr
tdiframe/td
td目标地址在框架显示/td
/tr
tr
th scope="row"3/th
th scope="row"width/th
td弹出层的宽/td
td colspan="2"必填，比如“200”。（不需要带px）/td
/tr
tr
th scope="row"4/th
th scope="row"height/th
td弹出层的高/td
td colspan="2"同 width/td
/tr
tr
th scope="row"5/th
th scope="row"drag/th
td是否可拖动/td
td colspan="2"必填，可选参数（true,false）/td
/tr
tr
th scope="row"6/th
th scope="row"time/th
td自动消失时间/td
td colspan="2"可不填，默认不自动关闭；参数可为空(quot;quot;)/td
/tr
tr
th scope="row"7/th
th scope="row"showbg/th
td是否显示遮罩层/td
td colspan="2"可不填，默认不显示（此项如填了，它前面的time也必须要填）/td
/tr
tr
th scope="row"8/th
th scope="row"cssName/th
td弹出层附加样式名/td
td colspan="2"可不填/td
/tr
/table
h3相关下载：/h3
pa href= ; title=JS文件下载JS文件下载/a | a href= ; title=完整包下载完整包下载/a/p
p style=float: right;最后更新日期：2009-11-24 By a href= ; title=AwaitAwait/abr //p
p style="clear: both;"/p
/div
br /
/body
/html
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
