<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="gb2312" />
<meta name="KeyWords" content="Alert弹出窗口 美化体验版 HTML网" />
<meta name="description" content="Alert弹出窗口 美化体验版 HTML网" />
<title>Alert弹出窗口 美化体验版</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
</style>
</head>
<body>
<div class="cecmbody" id="cecmpolicy">
<div class="leftClass">
<input type="button" value="点击这里" onclick="sAlert('测试效果');" />
</div>
</div>
<script type="text/javascript" language="javascript">
function sAlert(str){
var msgw,msgh,bordercolor;
msgw=400;//提示窗口的宽度
msgh=100;//提示窗口的高度
titleheight=25 //提示窗口标题高度
bordercolor="#336699";//提示窗口的边框颜色
titlecolor="#99CCFF";//提示窗口的标题颜色
var sWidth,sHeight;
sWidth=document.documentElement.clientWidth;
sHeight=document.documentElement.clientHeight;
var bgObj=document.createElement("div");
bgObj.setAttribute('id','bgDiv');
bgObj.style.position="absolute";
bgObj.style.top="0";
bgObj.style.background="#777";
bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity="0.6";
bgObj.style.left="0";
bgObj.style.width=sWidth + "px";
bgObj.style.height=sHeight + "px";
bgObj.style.zIndex = "10000";
document.body.appendChild(bgObj);
var msgObj=document.createElement("div")
msgObj.setAttribute("id","msgDiv");
msgObj.setAttribute("align","center");
msgObj.style.background="white";
msgObj.style.border="1px solid " + bordercolor;
msgObj.style.position = "absolute";
msgObj.style.left = "50%";
msgObj.style.top = "50%";
msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgObj.style.marginLeft = "-225px" ;
msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px";
msgObj.style.width = msgw + "px";
msgObj.style.height =msgh + "px";
msgObj.style.textAlign = "center";
msgObj.style.lineHeight ="25px";
msgObj.style.zIndex = "10001";
var title=document.createElement("h4");
title.setAttribute("id","msgTitle");
title.setAttribute("align","right");
title.style.margin="0";
title.style.padding="3px";
title.style.background=bordercolor;
title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity="0.75";
title.style.border="1px solid " + bordercolor;
title.style.height="18px";
title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";
title.style.color="white";
title.style.cursor="pointer";
title.innerHTML="关闭";
title.onclick=function(){
document.body.removeChild(bgObj);
document.getElementById("msgDiv").removeChild(title);
document.body.removeChild(msgObj);
}
document.body.appendChild(msgObj);
document.getElementById("msgDiv").appendChild(title);
var txt=document.createElement("p");
txt.style.margin="1em 0"
txt.setAttribute("id","msgTxt");
txt.innerHTML=str;
document.getElementById("msgDiv").appendChild(txt);
}
</script>
</body>
</html>
分享到：
相关推荐
页面开灯关灯效果的实现（一个按钮两种状态，主要是利用修改背景颜色来实现）
HTML5实现的关灯小游戏,请按下面开始按钮开始游戏,每关只能重置一次.本游戏由49盏灯所组成，共有两种状态,灯开的状态为黄色，关的状态为黑色，当按开始游戏按钮时，会模拟点亮一些灯当你把所有黄色的灯点为黑色，就...
在开灯关灯的应用中，我们可能会使用CSS来改变网页的整体背景色或文字颜色，以此模拟“开灯”和“关灯”的效果。例如，可以定义两个不同的CSS类，一个代表亮光模式，背景色为白色；另一个代表暗光模式，背景色为黑色...
在网页设计中，为了提供更好的用户体验，特别是在观看视频时，许多网站会采用“关灯”或“开灯”效果。这种效果允许用户在观看视频时将网页其他部分暗化，焦点集中在视频上，减少视觉干扰。`jQuery`库提供了一个简单...
在IT行业中，实现一个开灯关灯特效通常指的是在图形用户界面（GUI）或游戏引擎中创建一个模拟灯光开关效果的动画。这个特效可以应用于各种场景，如虚拟家居设计、电子游戏或者移动应用中的交互元素。下面将详细介绍...
JavaScript是一种广泛应用于网页和网络应用开发的脚本语言，它主要负责处理客户端的交互和动态效果。在网页中实现“关灯”效果，通常是指创建一个全屏黑色遮罩层，使得用户在观看某个特定内容时，背景变暗，突出显示...
jQuery关灯效果视频插件是一种常见的网页交互特效，主要用于在播放视频时使页面背景变暗，专注于视频内容，提升用户体验。这种效果通常被应用于在线视频网站、演示文稿或者任何需要突出显示视频元素的场景。在本文中...
在Android开发中，小项目“Tb开关灯效果”是一个典型的用户界面交互示例，它利用了ToggleButton控件来模拟现实生活中的开灯关灯动作。这个项目的核心在于理解和使用ToggleButton，以及处理其状态改变事件，进而影响...
【关灯游戏】，也被称为“开关灯”或“熄灯游戏”，是一种常见的逻辑与算法问题，也是初学者学习编程时经常会遇到的练习项目。在这个游戏中，玩家需要通过一系列操作使得屏幕上的一组灯泡全部熄灭。在iOS开发中，...
10. **软件工具**：如果"闪关灯"是一个软件，它可能是用于模拟或编辑闪光灯效果的应用，帮助用户在无闪关灯条件下实现类似效果。 以上是基于"闪关灯.rar"这一主题的广泛假设，实际内容需解压文件后才能确定。无论是...
"关灯游戏解题程序"是一款专门用于解决经典益智游戏——关灯游戏的软件。关灯游戏，又称为“熄灯游戏”，起源于1995年Tandy公司的一款手持电子游戏，其规则简单而富有挑战性。游戏通常在一个方格网格上进行，每个...
在Web开发领域，JavaScript（JS）和CSS3是两个不可或缺的技术，它们共同构建了网页的动态交互和视觉效果。在这个名为"js+css3灯泡开关开灯关灯黑白切换特效.zip"的压缩包中，我们可以看到一个利用JS和CSS3实现的灯泡...
"关灯游戏"是一种经典的逻辑益智游戏，通常在电子设备上进行，也包括iOS平台。这个游戏的目标是通过一系列操作使所有的灯熄灭。在这个版本的"关灯游戏"中，当你点击一盏灯时，它自身以及其周围的灯（如果存在的话）...
关灯游戏的算法通常涉及深度优先搜索（DFS）或广度优先搜索（BFS）等图论方法，也可能包含回溯法以找出所有可能的解决方案。 `bulb.exe` 是`bulb.c`经过编译后的可执行文件。在Windows操作系统中，`.exe`文件是可...
《小的关灯游戏》不仅仅是一场简单的光影变幻，它是一项挑战玩家逻辑思维和策略规划能力的益智游戏。这款游戏的独到之处在于玩家需要通过点击操作来改变游戏区域内各盏灯的状态。每盏灯都具有两种状态：开启或关闭，...
综上所述，"关灯小游戏"的实现涉及到了JavaScript的各个方面，包括事件处理、数据结构操作、逻辑计算、DOM操作、动画制作、游戏逻辑控制、用户界面设计以及性能优化等。这不仅是对JavaScript编程能力的锻炼，也是...
"关灯游戏"，也被称为"开关灯问题"或"灯泡问题"，是一个经典的计算机科学问题，通常用于教学和面试中，以测试候选人的逻辑思维和算法设计能力。在这个游戏中，有一排开关，每按一次，会改变其本身及相邻开关的状态，...
用户可能可以根据自己的喜好选择不同的主题来改变游戏的视觉效果。 6. **bin**目录：这是编译后生成的字节码文件（.class文件）的存放位置，Eclipse会将源代码编译后的结果放在这里。游戏的主要可执行文件很可能在...
总之，“关灯游戏（view）”是一个结合了UIView基础、用户交互、动画效果和基本游戏逻辑的实例，对于初学者来说，这是一个很好的学习iOS应用开发的项目。通过实际操作和调试这个游戏，开发者可以深入理解iOS应用的...
照明灯自动关灯装置，顾名思义，是一种通过某种机制自动控制照明灯具开启和关闭的装置。在本文中，我们讨论的是一种应用于三层楼楼梯照明灯的自动关灯控制电路，该系统能够根据使用者的需求自动控制一至三层楼梯的...