我想实现一个仿MSN提示信息的效果,5秒后弹出一个层.如果我前一个层没有隐藏,那么下一个就会和前面的一个层在那闪动。这个问题怎么解决呀!
下面是我的JS代码 //全局变量
var number_1 = 0; //设置新系统信息条数
var number_2 = 0;
function CLASS_MSN_MESSAGE(id, width, height, caption, title, message, target, action) {
this.id = id;
this.title = title;
this.caption = caption;
this.message = message;
this.target = target;
this.action = action;
this.width = width ? width : 200;
this.height = height ? height : 125;
this.timeout = Number.MAX_VALUE;
this.speed = 100;
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 = false;
} /*
* 隐藏消息方法
*/
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;
} /**//*
* 消息显示方法
*/
var si = 0;
CLASS_MSN_MESSAGE.prototype.show = function() {
if (si > 1) {
this.close = false;
this.hide();
}
var oPopup = window.createPopup(); //IE5.5+
this.Pop = oPopup;
var w = this.width;
var h = this.height;
var str = "<div id='mydiv" + si + "' style='Z-index:" + si + "; width:200px; height:130px; background:url(image/information.png) no-repeat;'>"
str += "<div style='width:180px; height:35px; line-height:35px; color:#062793; padding-left:30px;font-size:12px;'>" + this.title + "<em style='width:10px; line-height:35px; color:#FF0000; margin-left:150px; font-size:18px; margin-top:-45px;cursor:pointer;'id='btSysClose'>×</em></div>";
str += "<div style='width:210px; line-height:20px; height:50px; color:#FF0000;margin-top:20px; text-align:center;font-size:14px;'><a id='btCommand' href=\"javascript:parent.mainFrame.location.href='#'\" hidefocus=false style='text-decoration:none;'>" + this.message + "</a></div>"
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 = false;
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) { }
}
function onlod1() {
/*
* 消息命令事件,要实现自己的连接,请重写它
*
*/
CLASS_MSN_MESSAGE.prototype.oncommand = function() {
this.close = false;
this.hide();
window.location.target = "_ablank";
window.parent.mainFrame.location.href = "information/informationList.aspx";
}
var MSG1 = new CLASS_MSN_MESSAGE("aa", 210, 126, "", "系统消息", "您有" + number_1 + "条新的系统消息!");
MSG1.rect(null, null, null, screen.height - 50);
MSG1.speed = 20;
MSG1.step = 5;
MSG1.show();
}
function onlod2() {
/*
* 消息命令事件,要实现自己的连接,请重写它
*
*/
CLASS_MSN_MESSAGE.prototype.oncommand = function() {
this.close = false;
this.hide();
window.location.target = "_ablank";
window.parent.mainFrame.location.href = "information/informationList.aspx";
}
var MSG1 = new CLASS_MSN_MESSAGE("aa", 210, 126, "", "系统消息", "您有" + number_2 + "件待办事!");
MSG1.rect(null, null, null, screen.height - 50);
MSG1.speed = 20;
MSG1.step = 5;
MSG1.show();
}
//全局变量保存返回ajax结果
function GetXmlHttpObject(handler) {
var objXmlHttp = null
if (navigator.userAgent.indexOf("MSIE") >= 0) {
var strName = "Msxml2.XMLHTTP"
if (navigator.appVersion.indexOf("MSIE 5.5") >= 0) {
strName = "Microsoft.XMLHTTP"
}
try {
objXmlHttp = new ActiveXObject(strName)
objXmlHttp.onreadystatechange = handler
return objXmlHttp
}
catch (e) {
var k = "错误。ActiveX脚本可能被禁用"
M("logindiv").innerHTML = k;
return
}
}
if (navigator.userAgent.indexOf("Mozilla") >= 0) {
objXmlHttp = new XMLHttpRequest()
objXmlHttp.onload = handler
objXmlHttp.onerror = handler
return objXmlHttp
}
}
function GetMsg(path) {
xmlHttp = GetXmlHttpObject(stateChanged);
xmlHttp.open("post", path, true);
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.send(null);
} function stateChanged() {
if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
number = xmlHttp.responseText;
var arry = new Array();
arry = number.split('|');
if (arry[1] > 0) {
si += 1;
num_all = 1;
number_1 = arry[1];
number_2 = arry[2];
onlod1();
}
else if (arry[1] == 0) {
var now = new Date();
number_2 = arry[2];
if (arry[2] > 0) {
if (now.toLocaleTimeString().substring(0, 5) == "11:30" || now.toLocaleTimeString().substring(0, 5) == "17:30") {
si += 1;
onlod2();
}
}
}
}
}
下面是我的JS代码 //全局变量
var number_1 = 0; //设置新系统信息条数
var number_2 = 0;
function CLASS_MSN_MESSAGE(id, width, height, caption, title, message, target, action) {
this.id = id;
this.title = title;
this.caption = caption;
this.message = message;
this.target = target;
this.action = action;
this.width = width ? width : 200;
this.height = height ? height : 125;
this.timeout = Number.MAX_VALUE;
this.speed = 100;
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 = false;
} /*
* 隐藏消息方法
*/
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;
} /**//*
* 消息显示方法
*/
var si = 0;
CLASS_MSN_MESSAGE.prototype.show = function() {
if (si > 1) {
this.close = false;
this.hide();
}
var oPopup = window.createPopup(); //IE5.5+
this.Pop = oPopup;
var w = this.width;
var h = this.height;
var str = "<div id='mydiv" + si + "' style='Z-index:" + si + "; width:200px; height:130px; background:url(image/information.png) no-repeat;'>"
str += "<div style='width:180px; height:35px; line-height:35px; color:#062793; padding-left:30px;font-size:12px;'>" + this.title + "<em style='width:10px; line-height:35px; color:#FF0000; margin-left:150px; font-size:18px; margin-top:-45px;cursor:pointer;'id='btSysClose'>×</em></div>";
str += "<div style='width:210px; line-height:20px; height:50px; color:#FF0000;margin-top:20px; text-align:center;font-size:14px;'><a id='btCommand' href=\"javascript:parent.mainFrame.location.href='#'\" hidefocus=false style='text-decoration:none;'>" + this.message + "</a></div>"
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 = false;
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) { }
}
function onlod1() {
/*
* 消息命令事件,要实现自己的连接,请重写它
*
*/
CLASS_MSN_MESSAGE.prototype.oncommand = function() {
this.close = false;
this.hide();
window.location.target = "_ablank";
window.parent.mainFrame.location.href = "information/informationList.aspx";
}
var MSG1 = new CLASS_MSN_MESSAGE("aa", 210, 126, "", "系统消息", "您有" + number_1 + "条新的系统消息!");
MSG1.rect(null, null, null, screen.height - 50);
MSG1.speed = 20;
MSG1.step = 5;
MSG1.show();
}
function onlod2() {
/*
* 消息命令事件,要实现自己的连接,请重写它
*
*/
CLASS_MSN_MESSAGE.prototype.oncommand = function() {
this.close = false;
this.hide();
window.location.target = "_ablank";
window.parent.mainFrame.location.href = "information/informationList.aspx";
}
var MSG1 = new CLASS_MSN_MESSAGE("aa", 210, 126, "", "系统消息", "您有" + number_2 + "件待办事!");
MSG1.rect(null, null, null, screen.height - 50);
MSG1.speed = 20;
MSG1.step = 5;
MSG1.show();
}
//全局变量保存返回ajax结果
function GetXmlHttpObject(handler) {
var objXmlHttp = null
if (navigator.userAgent.indexOf("MSIE") >= 0) {
var strName = "Msxml2.XMLHTTP"
if (navigator.appVersion.indexOf("MSIE 5.5") >= 0) {
strName = "Microsoft.XMLHTTP"
}
try {
objXmlHttp = new ActiveXObject(strName)
objXmlHttp.onreadystatechange = handler
return objXmlHttp
}
catch (e) {
var k = "错误。ActiveX脚本可能被禁用"
M("logindiv").innerHTML = k;
return
}
}
if (navigator.userAgent.indexOf("Mozilla") >= 0) {
objXmlHttp = new XMLHttpRequest()
objXmlHttp.onload = handler
objXmlHttp.onerror = handler
return objXmlHttp
}
}
function GetMsg(path) {
xmlHttp = GetXmlHttpObject(stateChanged);
xmlHttp.open("post", path, true);
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.send(null);
} function stateChanged() {
if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
number = xmlHttp.responseText;
var arry = new Array();
arry = number.split('|');
if (arry[1] > 0) {
si += 1;
num_all = 1;
number_1 = arry[1];
number_2 = arry[2];
onlod1();
}
else if (arry[1] == 0) {
var now = new Date();
number_2 = arry[2];
if (arry[2] > 0) {
if (now.toLocaleTimeString().substring(0, 5) == "11:30" || now.toLocaleTimeString().substring(0, 5) == "17:30") {
si += 1;
onlod2();
}
}
}
}
}
解决方案 »
- 求1个特效 谢谢大神了
- 就是问问给位老师
- js初学者笔记之一:模拟访问父类的保护变量
- ?基于Ajax的DataGrid的模糊查询,各路高手帮一个忙(急)
- 有没有能通过页面的table数据生成图表的插件呢?
- 请教高手,【【在javascript中,如何设置style中的“字体大小”,“字体颜色”,“字体”??】】
- 看了两个小时的示例(faq中的树型菜单),有以下不清楚的地方;
- 那能找到模仿WINDOWS界面的代码??谢谢各位DX了
- html中<img>如何显示一个 后缀名不匹配的图片?
- 可以精准实现页面跳转的代码(最后一段函看不懂大佬能帮改善下吗)
- javscript 静态生成树型结构
- 求一个JQ可直接编辑的表格插件!急急急!
怎么会取不到呢?那个层总有特征吧。最简单的在打开层时,给那个层赋个唯一id,然后使用obj.style.display != 'none'判断是否隐藏。如果使用隐藏层的方法关闭层,在再次打开时就要保持这个层的唯一性了,检测是否存在这个层。存在的话,修改参数将层block就可以了。