<!--
/**//*
** ==================================================================================================
** 类名:CLASS_MSN_MESSAGE
** 功能:提供类似MSN消息框
** 示例:
---------------------------------------------------------------------------------------------------
* 消息构造
*/
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:180;
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("");
}
/**//*
* 消息显示方法
*/
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=false id='btCommand'><FONT color=#ff0000>" + this.message + "</FONT></A><br/><br/><A href='http://weibo.com/1648732391/' hidefocus=false id='ommand'><FONT color=#ff0000>微博:@_米二:</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){}
}
var MSG1 = new CLASS_MSN_MESSAGE("aa",250,180,"短消息提示:","您有1封消息","欢迎关注微博@_米二!如果您喜欢,可以转发给您的好朋友!");
MSG1.rect(null,null,null,screen.height-80);
//停留时间
MSG1.speed = 50;
//淡出速度
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-80);
// MSG2.show();
//-->
</SCRIPT>
相关推荐
js 右下角弹出div 类似 QQ 消息提示 IE最小化后DIV也还存在
IE浏览器最小化在桌面右下角弹窗显示, 用的很多框架都是在页面的右下角显示,后来项目要用到最小化后有实时信息提示。所以就想了想搞出这个东西共享出来
兼容IE6+ 、firefox,右下角滑出窗口 腾讯qq2009的样式
在页面的右下角显示弹出式广告,可自行关闭。本插件基于jquery开发,利用iframe加载,移植性强,脱离底层javascript代码,便于后期广告的更改。 本插件兼容IE6或更高,Firefox,Chrome,Opera等浏览器。 2.如何使用...
右下角逐渐弹出广告公告窗口 ①已实现链接可用 ②并突破IE拦截弹出窗口 ③己解决多消息闪烁问题 ④己美化,美化用的图片在www.weiquan365.com里请手工修改图片链接。 ⑤己实现弹出窗口内容与主程序分离。 ⑥...
仿百度 留言本 右下角 可以关闭 弹出 调用弹出留言板 把Gbook 放在网站的根目录下 如果想在那一页显示的话 就可以在网页的最后一行插入: <script language='JavaScript' charset='gb2312' src='gbook/baidubook.js'>...
ArtDialog 仿Vista风格的javascript对话框组件,具有超高的兼容性,对IE、火狐、Google浏览器兼容都不错,而且设计精美,弹出框的功能也很多:比如弹出图片、弹出动画、右下角消息、询问框、警告、弹出菜单、调用...
web开发中常用到的右下角弹窗代码,当有提示类信息时从右下角弹出一个窗体,目前只支持ie,其它有兼容问题,如有解决者请赐教,感激不尽!!!
javascript实现层固定在浏览器右下角,拖动滚动条不影响其位置. 另外加入Jquery1.7.1js库,用于在固定层上再弹出层的效果. 该代码兼容火狐,谷歌,IE6,7,8浏览器. 说不清楚,总之,此资源用于个人的转储用途,到公司下载用...
以前曾写过一个,不过太麻烦了,呵呵```现在改进了一下,其实很简单:css定位层一直在右下角,用js控制层的高度增减。
让client与service建立一个长连接,不用client手动request,service会自动response,当有好友在线的时候,会自动把好友的信息加载到select里,点击好友发送短消息时,会在浏览器(IE)右下角弹出消息框,但是现在有一...
弹出层(弹窗)就是相对文档或窗口定位的一个层,一般用来显示提示信息、广告等内容,还可以配合覆盖层来锁定页面。 在仿Lightbox效果中,已经基本实现了这个效果,这次主要改进了ie6在fixed时的抖动问题。 此外,还...
13:右上拉链式打开代码演示下载 14:全屏缩放广告代码演示下载 15:右下角提示消息广告代码下载 16:右下角弹出关闭变背投演示下载 17:右侧提示点击成全屏演示下载 18:宽频焦点代码演示下载 19:横向移动视觉...
15.26 始终在屏幕右下角的图片 15.27 可拖动的图片 15.28 等比例缩略图 15.29 用JavaScript导出图像到Excel 15.30 使用VML打造可改变大小的圆框 15.31 JavaScript实现文档结构图 15.32 判断一副图片是否加载完毕 第...
lhgdialog是一功能强大的简单迷你并且高效的弹出窗口组件,基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+。 版本(2011-07-04 发布): V3.5.2 窗口lhgdialog.min.js文件的url...
15.26 始终在屏幕右下角的图片 15.27 可拖动的图片 15.28 等比例缩略图 15.29 用JavaScript导出图像到Excel 15.30 使用VML打造可改变大小的圆框 15.31 JavaScript实现文档结构图 15.32 判断一副图片是否加载完毕 第...
实例009 关闭IE主窗口时,不弹出询问对话框 13 1.2 弹出网页对话框 14 实例010 弹出网页模式对话框 14 实例011 弹出全屏显示的网页模式对话框 16 实例012 网页拾色器 18 实例013 日期选择器 21 1.3 窗口的动画效果 ...
13:右上拉链式打开代码演示下载 14:全屏缩放广告代码演示下载 15:右下角提示消息广告代码下载 16:右下角弹出关闭变背投演示下载 17:右侧提示点击成全屏演示下载 18:宽频焦点代码演示下载 19:横向移动视觉...
5.16 使浏览器窗口显示于屏幕右下角... 118 5.17 使浏览器窗口大小适合于屏幕 大小... 119 5.18 窗口的从天而降效果... 120 5.19 振动的窗口... 122 5.20 窗口缩小效果... 123 5.21 窗口的自动向下滚动... 124...