页面右下角弹出消息提示框，显示报警信息
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ include file="/common/include.jspf"%>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
??? <title>首页</title>???
??? <link type="text/css" rel="Stylesheet" href="../css/index.css" />
??? <script type="text/javascript" src="../css/JScript.js"></script>???
</head>
<SCRIPT language="javascript">?
/**//*?
*??? 消息构造?
*/?
function CLASS_MSN_MESSAGE(id,width,height,caption,title,message1,message,target,action){?
??? this.id???? = id;?
??? this.title? = title;?
??? this.caption= caption;
?this.message1 = message1;
??? this.message= message;?
??? this.target = target;?
??? this.action = action;?
??? this.width??? = width?width:200;?
??? this.height = height?height:120;?
??? this.timeout= 150;?
??? this.speed??? = 20;
??? this.step??? = 1;
??? this.right??? = screen.width -1;?
??? this.bottom = screen.height;
??? this.left??? = this.right - this.width;
??? this.top??? = this.bottom - this.height;
??? this.timer??? = 0;
??? this.pause??? = false;
??? this.close??? = false;
??? this.autoHide??? = true;
}?
?
/**//*?
*??? 隐藏消息方法?
*/?
CLASS_MSN_MESSAGE.prototype.hide = function(){?
??? if(this.onunload()){?
??????? var offset? = this.height>this.bottom-this.top?this.height:this.bottom-this.top;
??????? var me? = this;?
??????? if(this.timer>0){??
??????????? window.clearInterval(me.timer);?
??????? }?
??????? var fun = function(){?
??????????? if(me.pause==false||me.close){
??????????????? var x? = me.left;
??????????????? var y? = 0;
??????????????? var width = me.width;
??????????????? var height = 0;
??????????????? if(me.offset>0){
??????????????????? height = me.offset;
??????????????? }
????
??????????????? y? = me.bottom - height;
????
??????????????? if(y>=me.bottom){
??????????????????? window.clearInterval(me.timer);?
??????????????????? me.Pop.hide();?
??????????????? } else {
??????????????????? me.offset = me.offset - me.step;?
??????????????? }
??????????????? me.Pop.show(x,y,width,height);???
??????????? }????????????
??????? };?
??????? this.timer = window.setInterval(fun,this.speed)?????
??? }?
};?
?
/**//*?
*??? 消息卸载事件，可以重写?
*/?
CLASS_MSN_MESSAGE.prototype.onunload = function() {?
??? return true;?
};?
/**//*?
*??? 消息命令事件，要实现自己的连接，请重写它?
*?
*/?
CLASS_MSN_MESSAGE.prototype.oncommand = function(){?
??? //this.close = true;
??? this.hide();?
??window.open("../oilalarm/oilAlarmAction!selectOilAlarmByFlag.action");
};
/**//*?
*??? 消息显示方法?
*/?
CLASS_MSN_MESSAGE.prototype.show = function(){?
??? var oPopup = window.createPopup(); //IE5.5+?
???
??? this.Pop = oPopup;?
?
??? var w = this.width;?
??? var h = this.height;?
?
??? var str = "<DIV style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 0px; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: " + w + "px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: " + h + "px; BACKGROUND-COLOR: #c9d3f3'>"?
??????? str += "<TABLE style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid' cellSpacing=0 cellPadding=0 width='100%' bgColor=#cfdef4 border=0>"?
??????? str += "<TR>"?
??????? str += "<TD style='FONT-SIZE: 12px;COLOR: #0f2c8c' width=30 height=24></TD>"?
??????? str += "<TD style='PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #1f336b; PADDING-TOP: 4px' valign=middle width='100%'>" + this.caption + "</TD>"?
??????? str += "<TD style='PADDING-RIGHT: 2px; PADDING-TOP: 2px' valign=middle align=right width=19>"?
??????? str += "<SPAN title=关闭 style='FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px' id='btSysClose' >×</SPAN></TD>"?
??????? str += "</TR>"?
??????? str += "<TR>"?
??????? str += "<TD style='PADDING-RIGHT: 1px;PADDING-BOTTOM: 1px' colSpan=3 height=" + (h-28) + ">"?
??????? str += "<DIV style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 8px; FONT-SIZE: 12px; PADDING-BOTTOM: 8px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 8px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%'>" + this.title + "<BR><BR>"?
??????? str += "<DIV style='WORD-BREAK: break-all' align=left>"+this.message1+"<A target='main' href='../oilalarm/oilAlarmAction!selectOilAlarmByFlag.action' hidefocus=false id='btCommand'><FONT color=#ff0000>" + this.message + "</FONT></A></DIV>"?
??????? str += "</DIV>"?
??????? str += "</TD>"?
??????? str += "</TR>"?
??????? str += "</TABLE>"?
??????? str += "</DIV>"?
?
??? oPopup.document.body.innerHTML = str;
???
?
??? this.offset? = 0;
??? var me? = this;?
??? oPopup.document.body.onmouseover = function(){me.pause=true;}
??? oPopup.document.body.onmouseout = function(){me.pause=false;}
??? var fun = function(){?
??????? var x? = me.left;
??????? var y? = 0;
??????? var width??? = me.width;
??????? var height??? = me.height;
??????????? if(me.offset>me.height){
??????????????? height = me.height;
??????????? } else {
??????????????? height = me.offset;
??????????? }
??????? y? = me.bottom - me.offset;
??????? if(y<=me.top){
??????????? me.timeout--;
??????????? if(me.timeout==0){
??????????????? window.clearInterval(me.timer);?
??????????????? if(me.autoHide){
??????????????????? me.hide();
??????????????? }
??????????? }
??????? } else {
??????????? me.offset = me.offset + me.step;
??????? }
??????? me.Pop.show(x,y,width,height);???
??? };?
?
??? this.timer = window.setInterval(fun,this.speed)?????
?
????
?
??? var btClose = oPopup.document.getElementById("btSysClose");?
?
??? btClose.onclick = function(){?
??????? me.close = true;
??????? me.hide();?
??? };?
?
??? var btCommand = oPopup.document.getElementById("btCommand");?
??? btCommand.onclick = function(){?
??????? me.oncommand();?
??? };??
? var ommand = oPopup.document.getElementById("ommand");?
????? ommand.onclick = function(){?
?????? //this.close = true;
??? me.hide();?
?window.open(ommand.href);
??? };??
};?
/**//*
** 设置速度方法
**/
CLASS_MSN_MESSAGE.prototype.speed = function(s){
??? var t = 20;
??? try {
??????? t = praseInt(s);
??? } catch(e){}
??? this.speed = t;
};
/**//*
** 设置步长方法
**/
CLASS_MSN_MESSAGE.prototype.step = function(s){
??? var t = 1;
??? try {
??????? t = praseInt(s);
??? } catch(e){}
??? this.step = t;
};
?
CLASS_MSN_MESSAGE.prototype.rect = function(left,right,top,bottom){
??? try {
??????? this.left??????? = left??? !=null?left:this.right-this.width;
??????? this.right??????? = right??? !=null?right:this.left +this.width;
??????? this.bottom??????? = bottom!=null?(bottom>screen.height?screen.height:bottom):screen.height;
??????? this.top??????? = top??? !=null?top:this.bottom - this.height;
??? } catch(e){}
};
//===============================================================
//id,width,height,caption,title,message,target,action
//用ajax获得要显示的信息开始
var xmlHttp;
var div;
function createXmlHttpRequest(){
//判断用户所使用的浏览器
?if(window.ActiveXObject){
??xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
?}else if(window.ActiveXObject){
??xmlHttp = new ActiveXObject("Msxml2.XMLHTTP.4.0");
?}else if(window.ActiveXObject){
??xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
?}else if(window.XMLHttpRequest){
??xmlHttp = new XMLHttpRequest();
?}
?}
//用户点击发送请求 登录
function start(){
?createXmlHttpRequest();
?//设置回调函数
?xmlHttp.onreadystatechange=callback;
?var url ="../oilalarm/oilAlarmAction!messageAlarmInfo.action";
?xmlHttp.open("get",url,true);
?xmlHttp.send(null);
}
//回调函数
function callback(){? ??
?if(xmlHttp.readyState==4){? ???
??if(xmlHttp.status==200){? ???
???//处理结果? ???
???var value=xmlHttp.responseText;
???var msg = value.split(";");
???if(msg[1]>0){//有记录
????var count = msg[1];
????var message=msg[0];???
????var MSG1 = new CLASS_MSN_MESSAGE("aa",200,120,"报警信息提示：","您有"+count+"条报警消息",message,"查看详情");?
?????? MSG1.rect(null,null,null,screen.height-50);
?????? MSG1.speed??? = 10;
?????? MSG1.step??? = 5;
?????? MSG1.show();?
???}else{
????var count = msg[1];
????var message=msg[0];???
????var MSG1 = new CLASS_MSN_MESSAGE("aa",200,120,"报警信息提示：","您有"+count+"条报警消息",message,"查看详情");?
?????? MSG1.rect(null,null,null,screen.height-50);
?????? MSG1.speed??? = 10;
?????? MSG1.step??? = 5;
?????? MSG1.show();
???}
?
??}
??}
}
</SCRIPT>
<body onload="start()">
?? <center>
???? <div style=" margin-top:50px; width: 100%">
????? <img src="../images/BGS.jpg" />
???? </div>
??? </center>
</body>
</html>
