您的位置:首页 > Web前端 > JQuery

Jquery插件,右下角弹窗提醒,无视框架

2014-08-14 12:08 288 查看
效果图:



HTML代码

<script src="/Scripts/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="/Scripts/message/jquery.messager.js" type="text/javascript"></script>
<script type="text/javascript">
var alarm_timer;
var hl_timer
$(document).ready(function () {
alarm_timer = setInterval("sendBedAlarm()", 10 * 60 * 1000); //床板报警,3分钟检查一次
hl_timer = setInterval("sendHLJLD()", 2 * 60 * 60 * 1000); //护理记录单打印提醒,2个小时检查一次
})
function sendBedAlarm() {
showMsg("/ZHBQ_Bedplate/GetAlarmInfo.ashx", 405, 220, '<font color="red">报警提醒</font>', '/ZHBQ_Bedplate/baojin.wav');
}
function sendHLJLD() {
showMsg("/WebService/HLJLRemindPrint.ashx", 405, 220, '<font color="red">打印提醒</font>');
}
</script>
</head>
<bgsound id="snd" src="" autostart="true" loop="infinite" />
js代码,jquery.messager.js文件

(function () {
var ua = navigator.userAgent.toLowerCase();
var is = (ua.match(/\b(chrome|opera|safari|msie|firefox)\b/) || ['', 'mozilla'])[1];
var r = '(?:' + is + '|version)[\\/: ]([\\d.]+)';
var v = (ua.match(new RegExp(r)) || [])[1];
jQuery.browser.is = is;
jQuery.browser.ver = v;
jQuery.browser[is] = true;
})();
//右上角关闭图片相对根目录路径
var imgSrc = "/Scripts/message/flora-close.png";
(function (jQuery) {
/*
*
* jQuery Plugin - Messager
*
* Author: corrie Mail: corrie@sina.com Homepage: www.corrie.net.cn
*
* Copyright (c) 2008 corrie.net.cn
*
* @license http://www.gnu.org/licenses/gpl.html [GNU General Public
* License]
*
*
*
* $Date: 2008-12-26
*
* $Vesion: 1.5 @ how to use and example: Please Open index.html
*
*/
this.version = '@1.5';
this.layer = {
'width': 200,
'height': 100
};
this.title = '信息提示';
this.time = 4000;
this.anims = {
'type': 'slide',
'speed': 600
};
this.timer1 = null;
this.inits = function (title, text) {
if ($("#message").is("div")) {
return;
}
$(document.body).prepend('<div id="message" style="border:#b9c9ef 1px solid;z-index:100;width:' + this.layer.width + 'px;height:' + this.layer.height + 'px;position:absolute; display:none;background:#cfdef4; bottom:0; right:0; overflow:hidden;"><div style="border:1px solid #fff;border-bottom:none;width:100%;height:25px;font-size:12px;overflow:hidden;color:#1f336b;"><span id="message_close" style="float:right;padding:5px 0 5px 0;width:16px;line-height:auto;color:red;font-size:12px;font-weight:bold;text-align:center;cursor:pointer;overflow:hidden;"><img src="' + imgSrc + '" border="0" /></span><div style="padding:5px 0 5px 5px;width:100px;font-weight:bold;font-size:14px;line-height:18px;text-align:left;overflow:hidden;">' + title + '</div><div style="clear:both;"></div></div> <div style="padding-bottom:5px;border:1px solid #fff;border-top:none;width:100%;height:auto;font-size:12px;"><div id="message_content" style="margin:0 5px 0 5px;border:#b9c9ef 1px solid;padding:10px 0 10px 5px;font-weight:bold;font-size:14px;width:' + (this.layer.width - 17) + 'px;height:' + (this.layer.height - 50) + 'px;color:#1f336b;text-align:left;overflow:hidden;">' + text + '</div></div></div>');
$("#message_close").click(function () {
setTimeout('this.close()', 1);
//停止播放声音
$("#snd").attr("src", '');
});
$("#message").hover(function () {
clearTimeout(timer1);
timer1 = null;
}, function () {
if (time > 0)
timer1 = setTimeout('this.close()', time);
});
$(window).scroll(function () {
var bottomHeight = "-" + document.documentElement.scrollTop;
$("#message").css("bottom", bottomHeight + "px");
});
};
this.show = function (title, text, time) {
if ($("#message").is("div")) {
return;
}
if (title == 0 || !title)
title = this.title;
this.inits(title, text);
if (time >= 0)
this.time = time;
switch (this.anims.type) {
case 'slide':
$("#message").slideDown(this.anims.speed);
break;
case 'fade':
$("#message").fadeIn(this.anims.speed);
break;
case 'show':
$("#message").show(this.anims.speed);
break;
default:
$("#message").slideDown(this.anims.speed);
break;
}
var bottomHeight = "-" + document.documentElement.scrollTop;
$("#message").css("bottom", bottomHeight + "px");
if ($.browser.is == 'chrome') {
setTimeout(function () {
$("#message").remove();
this.inits(title, text);
$("#message").css("display", "block");
}, this.anims.speed - (this.anims.speed / 5));
}
this.rmmessage(this.time);
};
this.lays = function (width, height) {
if ($("#message").is("div")) {
return;
}
if (width != 0 && width)
this.layer.width = width;
if (height != 0 && height)
this.layer.height = height;
}
this.anim = function (type, speed) {
if ($("#message").is("div")) {
return;
}
if (type != 0 && type)
this.anims.type = type;
if (speed != 0 && speed) {
switch (speed) {
case 'slow':
;
break;
case 'fast':
this.anims.speed = 200;
break;
case 'normal':
this.anims.speed = 400;
break;
default:
this.anims.speed = speed;
}
}
}
this.rmmessage = function (time) {
if (time > 0) {
timer1 = setTimeout('this.close()', time);
}
};
this.close = function () {
switch (this.anims.type) {
case 'slide':
$("#message").slideUp(this.anims.speed);
break;
case 'fade':
$("#message").fadeOut(this.anims.speed);
break;
case 'show':
$("#message").hide(this.anims.speed);
break;
default:
$("#message").slideUp(this.anims.speed);
break;
}
;
setTimeout('$("#message").remove();', this.anims.speed);
this.original();
}
this.original = function () {
this.layer = {
'width': 200,
'height': 100
};
this.title = '信息提示';
this.time = 4000;
this.anims = {
'type': 'slide',
'speed': 600
};
};
jQuery.messager = this;
return jQuery;
})(jQuery);

/*播放声音
src声音路径 /ZHBQ_Bedplate/baojin.wav
网页上放置 <bgsound id="snd" src="" autostart="true" loop="infinite" />
loop=infinite 是否自动反复播放;loop=2 表示重复两次,infinite 表示重复多次。
*/
function playSound(src) {
var _s = document.getElementById('snd');
if (src != '' && typeof src != undefined) {
_s.src = src;
}
}

/*在右下角弹出消息消息
url:一般处理程序地址,返回消息框内容,支持html
width:消息框宽度
height:消息框高度
title:消息框标题,支持html
soundSrc:播放声音路径,不要此参数或者是'',则不播放声音
*/
function showMsg(url, width, height, title, soundSrc) {
var time = new Date().getTime();
$.post(url + "?" + time, { type: 'refresh' }, function (msg) {
if (msg.length > 0) {
playSound(soundSrc);
$.messager.lays(width, height);
$.messager.show(title, msg, 0);
$("#message_content").html(msg);
} else {
$("#message").remove();
playSound('');
}
});
}

推荐其它提醒插件演示地址: http://www.jqueryrain.com/?rv0ica8W
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: