跟我做背景变暗，弹出提示层的功能,而且增加了对Select对象的支持
2007-05-15 14:59
573 查看
跟我做背景变暗，弹出提示层的功能,而且增加了对Select对象的支持
其实很简单，我也是学习别人的代码学习来的，
注意:密码是123
<html>
<head>
</head>
<body>
<p align="center">
<script>...
function locking()...{
document.all.ly.style.display="block";
document.all.ly.style.width=document.body.clientWidth;
document.all.ly.style.height=document.body.clientHeight;
document.all.Layer2.style.display='block';
}
function Lock_CheckForm(theForm)...{
if(theForm.P_USERPASS.value=='')...{alert("错误：请输入你的用户密码!");theForm.P_USERPASS.focus();return false;}
if(theForm.P_USERPASS.value !='123')...{alert("错误：密码错误!");theForm.P_USERPASS.value='';theForm.P_USERPASS.focus();return false;}
else...{document.all.ly.style.display='none';document.all.Layer2.style.display='none';}
return false;
}
</script>
<img src=http://www.shangdu.com/images/517s1.gif>
</p>
<p align="center">
<INPUT TYPE="button" value="系统锁定" onclick="locking()">
</p>
<div id="ly" style="position:absolute;top:0px;FILTER: alpha(opacity=60);background-color:#777; z-index:2; left: 0px;display:none;"> </div>
<!-- 浮层框架开始 -->
<div id="Layer2" align="center" style="position:absolute; z-index:3; width: 540; height:170px;left:expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);background-color:#fff;display:none;" valign="center">
<form method="POST" action="" onsubmit="return Lock_CheckForm(this);">
<TABLE width=540 height=170 border=0 cellpadding=0 cellspacing=0 style="border:0 solid #e7e3e7;border-collapse: collapse">
<TR>
<TD style="background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px;" height=27 valign="center">[ 警 告 ]</TD>
</TR>
<TR>
<TD align="center" valign="center">请输入解除锁定密码<p><input type="text" name="P_USERPASS" size="20"></TD>
</TR>
<TR>
<TD height=30 align="center"><INPUT type="submit" value=" 确 定 "></TD>
</TR>
</TABLE>
</form>
</div>
<!-- 浮层框架结束 -->
</body>
</html>
插入一个代码吧,方便你们用;)没办法，不能上传文件，还是贴代码吧;(
方法二 popup的方式
<script language="JavaScript">...
<!--
var oPopup=window.createPopup();
var oPopBody=oPopup.document.body;
var colorArr=["#F7F7F7","#E7E7E7","#D7D7D7","#D4D4D4","#BCBCBC","#ACACAC"];
var i=0;
var iMaxLength=6;
var timer=null;
function showPopup()...{
var oBody=document.body;
oPopBody.attachEvent("oncontextmenu",cancelEvent);
oPopBody.bgColor="#FFFFFF";
var strHTML=""
strHTML+='<center><div align="center" style="border:solid 2px #00FFFF;valign:middle; width:400; height:200">请您选中要操作的信件!<input type="button" value="确定" onclick="parent.hidePopup()"></div></center>';
oPopBody.innerHTML=strHTML;
oPopup.show(0,0,oBody.clientWidth,oBody.clientHeight,document.body);
chgBgcolor();
}
function chgBgcolor()...{
if(i<iMaxLength)...{
oPopBody.bgColor=colorArr[i++];
timer=setTimeout(chgBgcolor,100);
}
else...{
clearTimeout(timer);
i=0;
}
}
function cancelEvent()...{
return false;
}
function hidePopup()...{
oPopup.hide();
}
//-->
</script>
<input type="button" onclick="showPopup()" value="操作有误">
再加一个方法,带渐变效果的
<script language="JavaScript">...
<!--
var oPopup=window.createPopup();
var oPopBody=oPopup.document.body;
var colorArr=["#F7F7F7","#E7E7E7","#D7D7D7","#D4D4D4","#BCBCBC","#ACACAC"];
var i=0;
var iMaxLength=6;
var timer=null;
function showPopup()...{
var oBody=document.body;
oPopBody.attachEvent("oncontextmenu",cancelEvent);
oPopBody.bgColor="#FFFFFF";
var strHTML=""
strHTML+='<center><div align="center" style="border:solid 2px #00FFFF;valign:middle; width:400; height:200">请您选中要操作的信件!<input type="button" value="确定" onclick="parent.hidePopup()"></div></center>';
oPopBody.innerHTML=strHTML;
oPopup.show(0,0,oBody.clientWidth,oBody.clientHeight,document.body);
chgBgcolor();
}
function chgBgcolor()...{
if(i<iMaxLength)...{
oPopBody.bgColor=colorArr[i++];
timer=setTimeout(chgBgcolor,100);
}
else...{
clearTimeout(timer);
i=0;
}
}
function cancelEvent()...{
return false;
}
function hidePopup()...{
oPopup.hide();
}
//-->
</script>
<input type="button" onclick="showPopup()" value="操作有误">
其实很简单，我也是学习别人的代码学习来的，
注意:密码是123
<html>
<head>
</head>
<body>
<p align="center">
<script>...
function locking()...{
document.all.ly.style.display="block";
document.all.ly.style.width=document.body.clientWidth;
document.all.ly.style.height=document.body.clientHeight;
document.all.Layer2.style.display='block';
}
function Lock_CheckForm(theForm)...{
if(theForm.P_USERPASS.value=='')...{alert("错误：请输入你的用户密码!");theForm.P_USERPASS.focus();return false;}
if(theForm.P_USERPASS.value !='123')...{alert("错误：密码错误!");theForm.P_USERPASS.value='';theForm.P_USERPASS.focus();return false;}
else...{document.all.ly.style.display='none';document.all.Layer2.style.display='none';}
return false;
}
</script>
<img src=http://www.shangdu.com/images/517s1.gif>
</p>
<p align="center">
<INPUT TYPE="button" value="系统锁定" onclick="locking()">
</p>
<div id="ly" style="position:absolute;top:0px;FILTER: alpha(opacity=60);background-color:#777; z-index:2; left: 0px;display:none;"> </div>
<!-- 浮层框架开始 -->
<div id="Layer2" align="center" style="position:absolute; z-index:3; width: 540; height:170px;left:expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);background-color:#fff;display:none;" valign="center">
<form method="POST" action="" onsubmit="return Lock_CheckForm(this);">
<TABLE width=540 height=170 border=0 cellpadding=0 cellspacing=0 style="border:0 solid #e7e3e7;border-collapse: collapse">
<TR>
<TD style="background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px;" height=27 valign="center">[ 警 告 ]</TD>
</TR>
<TR>
<TD align="center" valign="center">请输入解除锁定密码<p><input type="text" name="P_USERPASS" size="20"></TD>
</TR>
<TR>
<TD height=30 align="center"><INPUT type="submit" value=" 确 定 "></TD>
</TR>
</TABLE>
</form>
</div>
<!-- 浮层框架结束 -->
</body>
</html>
插入一个代码吧,方便你们用;)没办法，不能上传文件，还是贴代码吧;(
方法二 popup的方式
<script language="JavaScript">...
<!--
var oPopup=window.createPopup();
var oPopBody=oPopup.document.body;
var colorArr=["#F7F7F7","#E7E7E7","#D7D7D7","#D4D4D4","#BCBCBC","#ACACAC"];
var i=0;
var iMaxLength=6;
var timer=null;
function showPopup()...{
var oBody=document.body;
oPopBody.attachEvent("oncontextmenu",cancelEvent);
oPopBody.bgColor="#FFFFFF";
var strHTML=""
strHTML+='<center><div align="center" style="border:solid 2px #00FFFF;valign:middle; width:400; height:200">请您选中要操作的信件!<input type="button" value="确定" onclick="parent.hidePopup()"></div></center>';
oPopBody.innerHTML=strHTML;
oPopup.show(0,0,oBody.clientWidth,oBody.clientHeight,document.body);
chgBgcolor();
}
function chgBgcolor()...{
if(i<iMaxLength)...{
oPopBody.bgColor=colorArr[i++];
timer=setTimeout(chgBgcolor,100);
}
else...{
clearTimeout(timer);
i=0;
}
}
function cancelEvent()...{
return false;
}
function hidePopup()...{
oPopup.hide();
}
//-->
</script>
<input type="button" onclick="showPopup()" value="操作有误">
再加一个方法,带渐变效果的
<script language="JavaScript">...
<!--
var oPopup=window.createPopup();
var oPopBody=oPopup.document.body;
var colorArr=["#F7F7F7","#E7E7E7","#D7D7D7","#D4D4D4","#BCBCBC","#ACACAC"];
var i=0;
var iMaxLength=6;
var timer=null;
function showPopup()...{
var oBody=document.body;
oPopBody.attachEvent("oncontextmenu",cancelEvent);
oPopBody.bgColor="#FFFFFF";
var strHTML=""
strHTML+='<center><div align="center" style="border:solid 2px #00FFFF;valign:middle; width:400; height:200">请您选中要操作的信件!<input type="button" value="确定" onclick="parent.hidePopup()"></div></center>';
oPopBody.innerHTML=strHTML;
oPopup.show(0,0,oBody.clientWidth,oBody.clientHeight,document.body);
chgBgcolor();
}
function chgBgcolor()...{
if(i<iMaxLength)...{
oPopBody.bgColor=colorArr[i++];
timer=setTimeout(chgBgcolor,100);
}
else...{
clearTimeout(timer);
i=0;
}
}
function cancelEvent()...{
return false;
}
function hidePopup()...{
oPopup.hide();
}
//-->
</script>
<input type="button" onclick="showPopup()" value="操作有误">
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 为 SELECT.options 对象增加或删除选项的方法在各浏览器中的支持情况不同
- 一个多浏览器支持的背景变暗的div并可拖动提示窗口功能的代码
- metinfo 5.0图片水印bug修改和支持透明背景png水印功能的增加
- 为 SELECT 对象增加或删除选项的方法在各浏览器中的支持情况不同
- 屏蔽：粘贴到KindEditor里，IE下弹出框报”对象不支持moveToElementText属性或方法“错误的提示
- 一个多浏览器支持的背景变暗的div并可拖动提示窗口功能的代码
- 针对ie6 用层来实现select的title 提示属性 (增加含有滚动条情况的支持)
- （简单的弹出div 覆盖背景）改善用户体验之alert提示效果 http://www.blueidea.com/tech/web/2006/4185.asp
- arcgis api for flex开发Query查询定位与中心定位查询功能 弹出定制提示框
- vs2008上QT中增加智能提示功能
- VC中鼠标经过按钮弹出功能提示（TIPS)
- 第三周上机任务--任务3--学会定义和使用类和对象--并按要求增加类的功能(简化版）
- javascript 方法 一直提示 对象不支持此属性或方法
- 一个不错的可拖动层遮罩加ALPHA滤镜(点击弹出后背景变浅色，信息提示框效果)
- 数据库关系图”提示：此数据库没有有效所有者，因此无法安装数据库关系图支持对象"的解决方法[转]
- 在myeclipse中编辑javascript脚本时增加提示功能
- aspxgridview CustomButtonCallback 不支持弹出消息提示
- sql2000备份的数据库还原到sql2005后，选择“数据库关系图”提示：此数据库没有有效所有者，因此无法安装数据库关系图支持对象。若要继续，请首先使用“数据库属性”对话框的“文件”页或 ALTER AUTHORIZATION 语句将数据库所
- 弹出提示 背景渐变