MSN消息提示类(II)
生活随笔
收集整理的這篇文章主要介紹了
MSN消息提示类(II)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
- 純js編寫
- 跨框架
- 無圖片
- 支持調速度
- 任意位置彈出
- 需要ie5.5以上
<SCRIPT?language=JavaScript>??
<!--??
??
/**//*??
**????==================================================================================================??
**????類名：CLASS_MSN_MESSAGE??
**????功能：提供類似MSN消息框??
**????示例：??
????---------------------------------------------------------------------------------------------------??
??
????????????var?MSG?=?new?CLASS_MSN_MESSAGE("aa",200,120,"短消息提示：","您有1封消息","今天請我吃飯哈");??
????????????????MSG.show();??
??
????---------------------------------------------------------------------------------------------------??
**????作者：ttyp??
**????郵件：ttyp@21cn.com??
**????日期：2005-3-18??
**????==================================================================================================??
**/??
??
??
/**//*??
?*????消息構造??
?*/??
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: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();??
}??
??
/**//*??
?*????消息顯示方法??
?*/??
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=center?width='100%'>"?+?this.caption?+?"</TD>"??
????????str?+=?"<TD?style='PADDING-RIGHT:?2px;?PADDING-TOP:?2px'?vAlign=center?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><A?href='javascript:void(0)'?hidefocus=true?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();??
????}????
}??
/**//*?
**?設置速度方法?
**/?
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){}?
}?
var?MSG1?=?new?CLASS_MSN_MESSAGE("aa",200,120,"短消息提示：","您有1封消息","今天請我吃飯哈");??
????MSG1.rect(null,null,null,screen.height-50);?
????MSG1.speed????=?10;?
????MSG1.step????=?5;?
????//alert(MSG1.top);?
????MSG1.show();??
?
//同時兩個有閃爍，只能用層代替了，不過層不跨框架?
//var?MSG2?=?new?CLASS_MSN_MESSAGE("aa",200,120,"短消息提示：","您有2封消息","好的啊");??
//???MSG2.rect(100,null,null,screen.height);?
//????MSG2.show();??
//-->??
</SCRIPT>?
?
<META?content="MSHTML?6.00.2800.1106"?name=GENERATOR></HEAD>?
<BODY></BODY></HTML>?
?
原帖地址：http://www.cnblogs.com/ttyp/archive/2005/03/18/121106.html
轉載于:https://www.cnblogs.com/Godblessyou/archive/2010/07/16/1779180.html
總結
以上是生活随笔為你收集整理的MSN消息提示类(II)的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 手机网页里的模态对话框
- 下一篇： 套管式换热器原理、设计、仿真！附全套资料