messager.js

(function (jQuery) {

    var window;

    var obj = new Object();

    obj.version = '@1.0';

    obj.title = '信息提示';

    obj.time = 4000;

    obj.anims = { 'type': 'slide', 'speed': 600 };

    obj.inits = function (title, text) {

        window = $('<div class="messager"><div class="messager-header"><div class="messager-close">×</div><div class="meaaager-title">'+title+'</div></div> <div class="messager-bottom"><div class="messager_content">'+text+'</div></div></div>')

        .appendTo('body')

        .hide();

        window.find('div.messager-close').click(function () {

            this.parentElement.parentElement.remove();

        });

    };

    obj.show = function (title, text, time) {

        if (title == 0 || !title) title = obj.title;

        obj.inits(title, text);

        if (time >= 0) obj.time = time;

        switch (this.anims.type) {

            case 'slide': window.slideDown(obj.anims.speed); break;

            case 'fade': window.fadeIn(obj.anims.speed); break;

            case 'show': window.show(obj.anims.speed); break;

            default: window.slideDown(obj.anims.speed); break;

        }

    };

    obj.anim = function (type, speed) {

        if (type != 0 && type) obj.anims.type = type;

        if (speed != 0 && speed) {

            switch (speed) {

                case 'slow':; break;

                case 'fast': obj.anims.speed = 200; break;

                case 'normal': obj.anims.speed = 400; break;

                default:

                    obj.anims.speed = speed;

            }

        }

    }

    jQuery.messager = obj;

    return jQuery;

})(jQuery);

messager.css

.messager

{

    position: absolute;

    background: #E0ECFF;

    border: 1px solid #95B8E7;

    z-index:;

    overflow: hidden;

    bottom: 0px;

    right: 0px;

    width: 200px;

    height: 100px;

}

.messager-header

{

    border:1px solid #fff;

    border-bottom:none;

    width:100%;

    font-size:12px;

    overflow:hidden;

    height:25px;

    color:#1f336b;

}

.messager-close

{

    float:right;

    padding:5px 0 5px 0;

    width:16px;

    color:red;

    font-size:12px;

    font-weight:bold;

    text-align:center;

    cursor:pointer;

    overflow:hidden;

}

.meaaager-title

{

    padding:5px 0 5px 5px;

    width:100px;

    text-align:left;

    overflow:hidden;

}

.messager-bottom

{

    padding-bottom:5px;

    border:1px solid #fff;

    border-top:none;

    width:100%;

    height:auto;

    font-size:12px;

}

.messager_content

{

    margin:0 5px 0 5px;

    border:#b9c9ef 1px solid;

    padding:10px 0 10px 5px;

    font-size:12px;

    width:183px;

    height:50px;

    color:#1f336b;

    text-align:left;

    overflow:hidden;

}

page

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="AlarmData.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <link href="messager.css" rel="stylesheet" />

    <script type="text/javascript" src="jquery-1.7.1.js"></script>

    <script src="messager.js"></script>

    <script type="text/javascript">

        $(function () {

            $("#showMessagerNoClose").click(function () {

                $.messager.show('不会关闭的消息', '要自己点关闭的X才可以哦！', 0);

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

    <input type="button" id="showMessagerNoClose" value="不自动关闭消息" />

    </div>

    </form>

</body>

</html>

　　

参考地址：http://www.cnblogs.com/linyijia/p/3467109.html

jquery之右下角消息提示框的更多相关文章

  1. 【WPF】屏幕右下角消息提示框

    WPF做一个仿QQ的右下角消息提示窗,网上找到几个Demo后,选了一个比较好用的. 博客 http://blog.csdn.net/huangli321456/article/details/5052 ...

  2. Jquery右下角消息提示框

    找了好久,终于找到一个不错的提示框jquery,免费给大家一起用下吧(可是花了我很多积分哦),顺便重写了一下样式,原来的样式真的不敢恭维啊... 下载地址:http://files.cnblogs.c ...

  3. jquery toastmessage （Jquery类似安卓消息提示框）

    Do you wanna have some toasts ? jquery-toastmessage-plugin is a JQuery plugin which provides android ...

  4. 基于jQuery消息提示框插件Tipso

    今天要分享的这款jQuery消息提示框插件名叫Tipso,它的特点是可以定义提示框的显示位置,以及动态改变提示框的提示内容,应该说是一款相当灵活的jQuery消息提示框插件.效果图如下: 在线预览   ...

  5. JS~Boxy和JS模版实现一个标准的消息提示框

    面向对象的封装 面向对象一个入最重要的特性就是“封装”,将一些没有必要公开的方法和属性以特定的方式进行组装,使它对外只公开一个接口,外界在调用它时,不需要关注它实现的细节,而只要关注它的方法签名即可, ...

  6. PowerShe 消息提示框测试

    1. 使用powerShell 弹出一个简单的消息框,代码如下,创建test.ps1脚本文件. $ConfirmPreference = 'None' $ws = New-Object -ComObj ...

  7. 第一百九十六节，jQuery EasyUI，Tooltip(提示框)组件

    jQuery EasyUI,Tooltip(提示框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Tooltip(提示框)组件的使用方法, ...

  8. wpf实现仿qq消息提示框

    原文:wpf实现仿qq消息提示框 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/huangli321456/article/details/5052 ...

  9. UWP中的消息提示框(二)

    在UWP中的消息提示框(一)中介绍了一些常见的需要用户主动去干涉的一些消息提示框,接下来打算聊聊不需要用户主动去干涉的一些消息提示框.效果就是像双击退出的那种提示框. 先说说比较简单的吧,通过系统To ...

随机推荐

  1. Google V8编程详解（三）Handle & HandleScope

    上一章简单的演示了一个Helloworld Demo.里面涉及到了V8的一些基本类型和概念,本章将围绕这个Demo对V8的基本类型和相关概念进行讲解. 这里还是先把Demo贴出来便于后面分析: #in ...

  2. 转载：java程序打包成jar 配置文件信息路径

    一个普通的java project,里面引用了config.properties配置文件,将项目打成Runnable jar,然后将config.properties放到打包后的jar路径下,执行该j ...

  3. 321android浏览器

    [应用简介] 321浏览器是IT蓝豹创始人在2012年的时候业余时间研发的项目,现在很多各大网站都扒了我们的源码, 并且还插入了他们的广告,这是一件特别令人痛恨的事,如果需要下载整版的同学们就上IT蓝 ...

  4. Tomcat安装及配置教程

    工具/原料 Tomcat7.0 eclipse 百度经验:jingyan.baidu.com java环境的配置 1 java环境的配置应该都学过吧,这里简单的讲一下. 下载安装java JDK,注意 ...

  5. 项目中可能用到的demo

    1. 轮播图   https://github.com/codingZero/XRCarouselView 2. 图表   https://github.com/Zirkfied/ZFChart

  6. Rust的几个预测

    写程序多年,语言也用过不下十种,对于Rust有种亲人的感觉,就像在梦中见到过似的.现在对于Rust特做出以下一些预测,希望Rust会有更大的影响力. 1. 当前的Rust的核心功能现以比较稳定,可以用 ...

  7. Altium Designer PCB双面板制作打印操作步骤

    Altium Designer PCB双面板制作打印操作步骤百度知道:http://jingyan.baidu.com/article/335530da83441c19cb41c3db.html?st ...

  8. (十三) [终篇] 一起学 Unix 环境高级编程 (APUE) 之 网络 IPC：套接字

    . . . . . 目录 (一) 一起学 Unix 环境高级编程 (APUE) 之 标准IO (二) 一起学 Unix 环境高级编程 (APUE) 之 文件 IO (三) 一起学 Unix 环境高级编 ...

  9. iOS常用网络库之AFNetWorking

    简介 ​     `AFNetworking`是iOS开发网络API中最常用的第三方库,`github`中的`star`数充分说明了它在iOS开发中第三方库中的江湖地位  github地址:[AFNe ...

  10. 解决跑twoBitToFa时出现“/admin/exe/linux.x86_64/twoBitToFa: Permission denied”的问题

    出现这种问题时,一般要加上以下命令: chmod ugo+x ./admin/exe/linux.x86_64/twoBitToFa 运行成功后,再将twobit格式转化为fa格式 ./admin/e ...