打印

渐变的Alert

wenming [楼主]

微笑的海豚

荣誉管理团队

帖子: 2370
体力: 6057
威望: 39
当前: 北京海淀区
离线: 3 天

专长 JS,PHP,MySQL

1^# 大中小发表于 2006-7-18 19:53

美感不足，做得不是很漂亮，不过觉得蛮好玩的。
最好是在IE里看，不然会S得很难看的。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="gb2312" >
<head>
	<meta http-equiv="content-type" content="text/html; charset=gb2312" />
	<meta name="author" content="Smiling Dolphin" />
	<meta name="keywords" content="design, css, cascading, style, sheets, xhtml, graphic design, w3c, web standards, visual, display, java, javascript, c++, php, jsp, asp, py, pl" />
	<meta name="description" content="my favorites language." />
	<meta name="robots" content="all" />
	<title>Dolphin Document</title>
</head>
<body>
<input type="button" value="显示Alert" onclick="alert('我改写了Alert显示的样式')" />
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
abc
<script language="javascript" type="text/javascript">
window.alert = function(txt)
{
	//document.write(txt);
	var shield = document.createElement("DIV");
	shield.style.position = "absolute";
	shield.style.left = "0px";
//	shield.id = "shield";
	shield.style.top = "0px";
	shield.style.width = "100%";
	shield.style.height = document.body.clientHeight+"px";
	shield.style.background = "#333";
	shield.style.textAlign = "center";
//	shield.style.lineHeight = document.body.clientHeight+"px";
	shield.style.zIndex = "1";
	shield.style.filter = "alpha(opacity=0)";
	var alertFram = document.createElement("DIV");
	alertFram.style.position = "absolute";
	alertFram.style.left = "50%";
	alertFram.style.top = "50%";
	alertFram.style.marginLeft = "-225px";
	alertFram.style.marginTop = "-75px";
	alertFram.style.width = "450px";
	alertFram.style.height = "150px";
	alertFram.style.background = "#ccc";
	alertFram.style.textAlign = "center";
	alertFram.style.lineHeight = "150px";
	alertFram.style.zIndex = "2";
	strHtml = "<ul style=\"list-style:none;margin:0px;padding:0px;width:100%\">\n";
	strHtml += "	<li style=\"background:#DD828D;text-align:left;padding-left:20px;font-weight:bold;height:25px;line-height:25px;border:1px solid #F9CADE;\">[系统提示]</li>\n";
	strHtml += "	<li style=\"background:#fff;text-align:center;font-weight:bold;height:120px;line-height:120px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;\">"+txt+"</li>\n";
	strHtml += "	<li style=\"background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px; border:1px solid #F9CADE;\"><input type=\"button\" value=\"确 定\" onclick=\"doOk()\" /></li>\n";
	strHtml += "</ul>\n";
	alertFram.innerHTML = strHtml;
	document.body.appendChild(alertFram);
	document.body.appendChild(shield);
	var c = 0;
	this.doAlpha = function(){
		if (c++ > 10){clearInterval(ad);return 0;}
		shield.style.filter = "alpha(opacity="+c+");";
	}
	var ad = setInterval("doAlpha()",20);
	this.doOk = function(){
		alertFram.style.display = "none";
		shield.style.display = "none";
	}
}
</script>
</body>
</html>

提示：您可以先修改部分代码再运行

[ 本帖最后由 marvellous 于 2006-7-18 22:43 编辑 ]

本帖最近评分记录

hutia 威望 +2 精品文章 2006-7-18 22:39

珍视拥有的、遗忘失去的。

TOP

做西部数码代理.Cn1元国际45元 | 将虚拟化进行到底

HotHeart

徐徐

银牌会员

帖子: 1231
体力: 2532
威望: 24

专长 JS,ASP,.NET

2^# 大中小发表于 2006-7-18 22:53

IE会闪一下，我用的IE7 Beta3

Simple,Natural,Actual
HotHear's BLOG

TOP

【美橙超级G空间】688元绑定10个子目录 | oracle工程师注册

alenalen

中级会员

帖子: 168
体力: 464
威望: 5
离线: 6 天

3^# 大中小发表于 2006-7-19 00:53

在opera试了一下,也蛮漂亮的,只不过没有了滤镜效果

http://fouryes.cn

TOP

请大家尊重和保护奥运知识产权。

m173

金牌会员

帖子: 5342
体力: 4773
威望: 0
当前: 广东珠海

专长 网页设计,平面

4^# 大中小发表于 2006-7-19 01:19

晕，虚拟的不算ALERT吧

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!

xcb3422

初级会员

帖子: 70
体力: 155
威望: 1
离线: 345 天

5^# 大中小发表于 2006-7-19 03:51

满好看的

广告策划与平面设计资料共享

TOP

IamUE

银牌会员

帖子: 604
体力: 1698
威望: 0
当前: 北京昌平区
离线: 251 天

6^# 大中小发表于 2006-7-19 08:09

alert除了提示,还有个重要作用是暂时中止程序,要能解决这个就完美了

1997年过去了我很怀念它

TOP

wenming [楼主]

微笑的海豚

荣誉管理团队

帖子: 2370
体力: 6057
威望: 39
当前: 北京海淀区
离线: 3 天

专长 JS,PHP,MySQL

7^# 大中小发表于 2006-7-19 09:04

楼上的，我昨晚想了蛮久，也没想出来怎么解决那个问题。js本身没有暂停中止程序的。用死偱环也不行。

珍视拥有的、遗忘失去的。

TOP

zg820

新手上路

帖子: 13
体力: 27
威望: 0
离线: 632 天

8^# 大中小发表于 2006-7-21 17:21

我觉得不一定非得要替换系统alert ，随便建一个函数就可以了。

TOP

colordancer

初级会员

帖子: 63
体力: 140
威望: 0
离线: 50 天

9^# 大中小发表于 2006-7-21 18:23

其实算不上alert()。
只不过那个函数把alert()覆盖了而已，实现的是top div。用另外一个函数名也可以。

ps: 兼容ff的透明可以用opacity:0.5

世人的事，世人去说。

TOP

w5676

新手上路

帖子: 16
体力: 30
威望: 0
离线: 416 天

10^# 大中小发表于 2006-11-4 10:57

http://bbs.blueidea.com/thread-2688074-1-3.html

TOP

91first

灰菜

中级会员

帖子: 202
体力: 371
威望: 0
当前: 福建福州

11^# 大中小发表于 2007-11-17 12:22

和alert还差了一些吧，经不住刷新~~

寂寞无处不在

TOP

tungvivi

新手上路

帖子: 67
体力: 10
威望: 0
离线: 14 天

12^# 大中小发表于 2007-11-17 13:12

非常烂楼主火星来的？

TOP