软讯网络 > 网站建设 > ASP.NET > Js + Css的msn式的popup提示窗口的实现
【标 题】:Js + Css的msn式的popup提示窗口的实现
【关键字】:
Js,Css,msn,popup
【来 源】:http://blog.csdn.net/ranzige/archive/2007/04/11/1560032.aspx
Js + Css的msn式的popup提示窗口的实现
Msn的提示窗口非常经典,所以我们也做一个javascript实现一下,给大家逗乐用。


/**//*eMsg*/
var divTop,divLeft,divWidth,divHeight,docHeight,docWidth,i = 0;
var eMsg = new Object();
eMsg.lightSrc = '../image/message/light.gif';
eMsg.closeSrc = '../image/message/msgclose.gif';
eMsg.id = 'eMsg';

eMsg.obj = function()
{return document.getElementById(eMsg.id);};


eMsg.onLoad = function()
{

try
{
divTop = parseInt(eMsg.obj().style.top,10);
divLeft = parseInt(eMsg.obj().style.left,10);
divHeight = parseInt(eMsg.obj().offsetHeight,10);
divWidth = parseInt(eMsg.obj().offsetWidth,10);
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
eMsg.obj().style.top = parseInt(document.body.scrollTop,10) + docHeight + 10;
eMsg.obj().style.left = parseInt(document.body.scrollLeft,10) + docWidth - divWidth;
eMsg.obj().style.visibility="visible";
eMsg.timer = window.setInterval(eMsg.move,1);

hp.skin.onBeforChange = function()
{
if(eMsg.obj())eMsg.obj().parentNode.removeChild(eMsg.obj());
};
}

catch(e)
{}
};

eMsg.onResize = function()
{
i+=1;
if(i>1000) eMsg.close();

try
{
divHeight = parseInt(eMsg.obj().offsetHeight,10);
divWidth = parseInt(eMsg.obj().offsetWidth,10);
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
eMsg.obj().style.top = docHeight - divHeight + parseInt(document.body.scrollTop,10);
eMsg.obj().style.left = docWidth - divWidth + parseInt(document.body.scrollLeft,10);
}

catch(e)
{}
};

eMsg.move = function()
{
try

{
if(parseInt(eMsg.obj().style.top,10) <= (docHeight - divHeight + parseInt(document.body.scrollTop,10)))

{
window.clearInterval(eMsg.timer);
eMsg.timer = window.setInterval(eMsg.onResize,1);
}
divTop = parseInt(eMsg.obj().style.top,10);
eMsg.obj().style.top = divTop - 1;
}

catch(e)
{}
};

eMsg.close = function()
{
eMsg.obj().parentNode.removeChild(eMsg.obj());
if(eMsg.timer) window.clearInterval(eMsg.timer);
};

eMsg.createInstance = function(titleHtml,bodyHtml)
{
if(!titleHtml || !bodyHtml)throw '必须为titleHtml指定值,必须为bodyHtml指定值。';
var odiv = document.createElement('DIV');
odiv.id = eMsg.id;
odiv.innerHTML = '<div class="eMsgInner">'
+ '<div class="head">'
+ '<div class="headLeft"><img src="space.gif" height="1" width="1"/></div>'
+ '<div class="headMiddle">' + titleHtml + '</div>'
+ '<div class="headRight"><img src="' + eMsg.closeSrc + '" onclick="eMsg.close()" align="absmiddle"/></div>'
+ '</div>'
+ '<div class="body" oncontextmenu="eMsg.close();return false;" title="右键关闭">'
+ '<div class="light"><IMG src="' + eMsg.lightSrc + '"></div>'
+ '<div class="content">'
+ bodyHtml
+ '</div>'
+ '</div>'
+ '</div>';
document.body.appendChild(odiv);
};

window.onresize = eMsg.onResize;