以前做过一个,但要在<body></body>中插入div,用起来很不方便,干脆做成了一个JS文件,
DIV通过document.body.insertBefore来插入.代码如下:
//自动消失的消息显示框
function MyMsgDiv()
{
this.msgDiv = null;
this.msgStyle = "FONT-SIZE:12px;LEFT:expression(this.offsetParent.scrollLeft+20);COLOR:#ffffff;LINE-HEIGHT:150%;POSITION:absolute;TOP:expression(this.offsetParent.scrollTop+10);BACKGROUND-COLOR:#7f1ef6;";
this.ffMsgStyle = "FONT-SIZE:12px;LEFT:20px;COLOR:#ffffff;LINE-HEIGHT:150%;POSITION:absolute;TOP:10px;BACKGROUND-COLOR:#7f1ef6;";
this.createDiv = function()
{
this.msgDiv = document.createElement("div");
if(window.XMLHttpRequest)
{
this.msgDiv.style.cssText = this.ffMsgStyle;
}
else
{
this.msgDiv.style.cssText = this.msgStyle;
}
document.body.insertBefore(this.msgDiv, document.body.childNodes[0]);
}
this.Show = function(msgstr)
{
this.msgDiv.innerHTML = " " + msgstr + " ";
}
this.createDiv(); //放置此处是为了防止以下的md值为null
var closetime;
var md = this.msgDiv;
this.Show = function(msg,showtime)
{
md.innerHTML =" "+msg+" ";
md.style.visibility = "visible";
if(closetime)window.clearTimeout(closetime);
closetime=setTimeout(this.Hidden,showtime*1000);
}
this.Hidden = function()
{
md.innerHTML = "";
md.style.visibility = "hidden";
}
}
function test()
{
var md = new MyMsgDiv();
md.Show("Hello, world!", 3);
}
DIV通过document.body.insertBefore来插入.代码如下:
//自动消失的消息显示框 function MyMsgDiv() {
this.msgDiv = null; this.msgStyle = "FONT-SIZE:12px;LEFT:expression(this.offsetParent.scrollLeft+20);COLOR:#ffffff;LINE-HEIGHT:150%;POSITION:absolute;TOP:expression(this.offsetParent.scrollTop+10);BACKGROUND-COLOR:#7f1ef6;"; this.ffMsgStyle = "FONT-SIZE:12px;LEFT:20px;COLOR:#ffffff;LINE-HEIGHT:150%;POSITION:absolute;TOP:10px;BACKGROUND-COLOR:#7f1ef6;"; this.createDiv = function() {
this.msgDiv = document.createElement("div"); if(window.XMLHttpRequest) { this.msgDiv.style.cssText = this.ffMsgStyle; } else { this.msgDiv.style.cssText = this.msgStyle; } document.body.insertBefore(this.msgDiv, document.body.childNodes[0]); } this.Show = function(msgstr) { this.msgDiv.innerHTML = " " + msgstr + " "; } this.createDiv(); //放置此处是为了防止以下的md值为null var closetime; var md = this.msgDiv; this.Show = function(msg,showtime) { md.innerHTML =" "+msg+" "; md.style.visibility = "visible"; if(closetime)window.clearTimeout(closetime); closetime=setTimeout(this.Hidden,showtime*1000); } this.Hidden = function() { md.innerHTML = ""; md.style.visibility = "hidden"; } }需要用到此功能的页面中,包含脚本文件,
然后建立一个MyMsgDiv实例,显示信息时再调用实例的Show方法即可:
function test(){ var md = new MyMsgDiv(); md.Show("Hello, world!", 3);}