jquery-模仿qq提示消息
( 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;
})();
( 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;">×</span><div style="padding:5px 0 5px 5px;width:100px;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-size:12px;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);
});
$("#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);
jquery-模仿qq提示消息的更多相关文章
- 【WP8】仿QQ提示消息
WP版的QQ提示消息的时候从顶部滑入,3秒后从顶部滑出,本文模仿该效果实现一个MessageToastManager类用于显示提示消息 思路很简单,就是动画而已,支持配置颜色和回掉 // ****** ...
- jQuery动态提示消息框效果
效果预览:http://keleyi.com/keleyi/phtml/jqtexiao/2.htm 原文:http://keleyi.com/a/bjac/hxv86dyi.htm <!DOC ...
- jQuery实现鼠标移到元素上动态提示消息框效果
当光标移动到某些元素上时,会弹出像tips的提示框,这种效果想必大家都有见到过吧,下面有个不错的示例,大家可以感受下 当光标移动到某些元素上时,会弹出像tips的提示框. 复制代码代码如下: < ...
- Jquery 网站保存信息提示消息实现,提示后自动消失
现在的大多数网站都有校验,以及信息提示:为了给用户更好的体验可以不用alert提示消息,采用jQuery提示完消息,自动消失 css <style> #tip_message { z-in ...
- 一款基于jquery超炫的弹出层提示消息
今天给大家带来一款基于jquery超炫的弹出层提示消息.这款实例页面初始时,一个go按钮.当单击go按钮时,提示强出层以动画形式出现.效果图如下: 在线预览 源码下载 实现的代码. html代码: ...
- jquery提示消息,简单通用
jquery提示消息.简单通用 function showTips(txt,time,status) { var htmlCon = ''; if(txt != ''){ if(status != 0 ...
- jquery easyui 弹出消息框 (转载) jQuery EasyUI API 中文文档 - 消息框(Messager) http://www.cnblogs.com/hantianwei/archive/2012/03/19/2407113.html
<html> <head> <!-- 导入easyui插件的js和css样式; --> <link rel="stylesheet" ty ...
- jquery easyui 弹出消息框
<html> <head> <!-- 导入easyui插件的js和css样式; --> <link rel="stylesheet" ty ...
- 关于 使用python向qq好友发送消息(对爬虫的作用----当程序执行完毕或者报错无限给自己qq发送消息,直到关闭)
以前看到网上一些小程序,在处理完事物后会自动发送qq消息,但是一直搞不懂是说明原理.也在网上找过一些python登陆qq发送消息的文字,但是都太复杂了.今天偶然看到一篇文章,是用python调用win ...
随机推荐
- Flume - Kafka日志平台整合
1. Flume介绍 Flume是Cloudera提供的一个高可用的,高可靠的,分布式的海量日志采集.聚合和传输的系统,Flume支持在日志系统中定制各类数据发送方,用于收集数据:同时,Flume提供 ...
- Java设计模式-合成模式
合成模式有时也叫组合模式,对象组合成树形结构以表示"部分-整体"的层次结构,组合模式使得用户对单个对象和组合对象的使用具有一致性.掌握组合模式的重点是要理解清楚 "部分/ ...
- [总结] 第二类Stirling数
上一道例题 我们来介绍第二类Stirling数 定义 第二类Stirling数实际上是集合的一个拆分,表示将n个不同的元素拆分成m个集合的方案数,记为 或者 .和第一类Stirling数不同的是,集合 ...
- 笔记:Hibernate SQL 查询
Hibernate 支持使用原生的SQL查询,使用原生SQL查询可以利用某些数据库特性,原生SQL查询也支持将SQL语句放在配置文件中配置,从而提高程序的解耦,命名SQL查询还可以用于调用存储过程. ...
- python读取三维点云球坐标数据并动态生成三维图像与着色
关键步骤: 1.首先通过读取.txt文本数据并进行一系列字符串处理,提取显示所需要的相关数据矩阵 2.然后利用python的matplotlib库来进行动态三维显示 备注:matplotlib在显示2 ...
- 随记PC-win7 64位系统网络连接状态一直转圈、等待状态的异常解决方案
各位看官好~ 最近电脑也做了下升级,入手个士必得360G的SSD来玩玩,顺便也下个新系统,看看有什么区别,想想顺便升级下系统也是好的,就开始了装机,装系统的路程~~~~~~ 好了不说废话,直接进入主题 ...
- iOS 消息发送与转发详解
Objective-C 是一门动态语言,它将很多静态语言在编译和链接时期做的事情,放到了运行时来处理.之所以能具备这种特性,离不开 Runtime 这个库.Runtime 很好的解决了如何在运行时期找 ...
- 真是没想到,ikvm.net居然停止开发了。
看样子作者对.net已经失去了信心 http://weblog.ikvm.net/CommentView.aspx?guid=33ea525f-a291-418a-bd6a-abdf22d0662b# ...
- RabbitMQ 发布订阅持久化
RabbitMQ是一种重要的消息队列中间件,在生产环境中,稳定是第一考虑.RabbitMQ厂家也深知开发者的声音,稳定.可靠是第一考虑,为了消息传输的可靠性传输,RabbitMQ提供了多种途径的消息持 ...
- [BZOJ 1040][ZJOI2008]骑士
1040: [ZJOI2008]骑士 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 5403 Solved: 2060[Submit][Status ...