Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

时间：2022-09-03 14:41:59

一、信息种类说明：

1.1、操作成功信息

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

1.2、错误信息

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

1.3、警告信息

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

1.4、通知信息

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

二、使用说明

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

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

<title>Insert title here</title>

<link href="style/showInfoDialog.css" rel="stylesheet" type="text/css" />

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

<script type="text/javascript" src="js/jquery-ui-1.9.1.custom.min.js"></script>

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

</head>

<body style="background-color:#4ed">

<div id = "test" style="width:1000px;height:800px;background-color:#fff">

</div>

    <script type="text/javascript">

        var options = {

                'dialogType' : 'info',

                'theme' : 'info',

                'message' : '数据加载完成！',

                'refresh' : false

        };

        $("#test").showInfoDialog(options);

    </script>

</body>

</html>
Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）

该例中对id为test的标签进行遮罩，然后显示信息

简单设置：

除包含必要的js,css文件外，另外需设置dialogType,theme属性，dialogType有四种方式：success,error,warning,info; 对应于四种主题（theme）设置：success,error,warning,info

message是需要显示的数据；

refresh代表关闭弹出框后是否需要重新加载页面

扩展：你可以添加自己的主题，格式如下：

.info {border: 3px solid #2FADD7; background: #92D6ED repeat-x top;}

.info span {color: #0E7A9F;}

.info .closestatus a {background: #2FADD7;}

.info .closestatus a:hover {background: #228DB0;}

Jquery插件之信息弹出框showInfoDialog（成功、错误、警告、通知）的更多相关文章

  1. jquery dialog-优雅的弹出框

    前面一章已经对datepicker的使用,做了简单的说明.这一章主要对dialog如何使用做个说明.         jquery ui-dialog在web开发中运用还是比较多的.最常见的例子就是登 ...

  2. Bootstrap入门（二十九）JS插件6：弹出框

    Bootstrap入门(二十九)JS插件6:弹出框 加入小覆盖的内容,像在iPad上,用于存放非主要信息 弹出框是依赖于工具提示插件的,那它也和工具提示是一样的,是需要初始化才能够使用的 首先我们引入 ...

  3. UniGui的信息弹出框MessageDlg自定义标题的方法（使用JS动态本地化文本）

    UniGui的信息弹出框MessageDlg的原型定义如下: procedure MessageDlg(const Msg: string; DlgType: TMsgDlgType; Buttons ...

  4. jQuery插件---轻量级的弹出窗口wBox

    Box Demo wBox——轻量级的弹出窗口jQuery插件,基于jQuery1.4.2开发,主要实现弹出框的效果,并且加入了很多有趣的功能,比如可img灯箱效果,callback函数,显示隐藏层, ...

  5. jquery实现简单的弹出框

    弹出框本身是一个div,默认是隐藏不展示的,在需要弹框的时候使其显示,并浮在当前页面之上 弹框样式: .tanchuang { width: 100%; height: 100%; display: ...

  6. 四种常见的提示弹出框（success，warning，error，loading）原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  7. 弹出框插件——dialog

    基于jquery和dot.js弹出框插件,兼容IE6+等其他浏览器. 思想:弹出框元素插入body节点中,并在页面垂直居中显示(fixed定位),触发确定和关闭事件绑定. 注意ie6包含两个问题:一. ...

  8. 第二百四十六节，Bootstrap弹出框和警告框插件

    Bootstrap弹出框和警告框插件 学习要点: 1.弹出框 2.警告框 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件. 一．弹出框 弹出框即点击一个元素弹出一个包含标题和内容的 ...

  9. jQuery WIN 7透明弹出层效果

    jQuery WIN 7透明弹出层效果,点击可以弹出一个透明层的jquery特效,插件可以调弹出框的宽度和高度,很不错的一个弹出层插件. 适用浏览器:IE8.360.FireFox.Chrome.Sa ...

随机推荐

  1. linux 查找文件的命令

    http://www.ruanyifeng.com/blog/2009/10/5_ways_to_search_for_files_using_the_terminal.html

  2. tomcat WEB-INF中的结构

    tomcat中 WEB-INF中结构包含3个东西:web.xml,classes文件夹,lib文件夹 web.xml用来配置web中服务调用的uri和对应服务指定的是哪个class文件 classes ...

  3. 【leetcode】Multiply Strings

    Multiply Strings Given two numbers represented as strings, return multiplication of the numbers as a ...

  4. PCA in Bioinformatics

    光看原理和代码是没用的,得看看具体算法在实际中的用途,多看看文献. Principal component analysis for clustering gene expression data

  5. Leetcode&num;138 Copy List with Random Pointer

    原题地址 非常巧妙的方法,不需要用map,只需要O(1)的额外存储空间,分为3步: 1. 先复制链表,但是这个复制比较特殊,每个新复制的节点添加在原节点的后面,相当于"加塞"2. ...

  6. AOJ 0558 Cheese

    Cheese Time Limit : 8 sec, Memory Limit : 65536 KB チーズ (Cheese) 問題 今年も JOI 町のチーズ工場がチーズの生産を始め,ねずみが巣から ...

  7. centos网络安装中的注意点

    转自centos网络安装中的注意点 centos网络安装的教程网上很多,这里仅仅记录一下安装过程中网上别处提及很少的注意点. 1.centos默认会安装selinux,并且默认阻止ftp服务,所以要禁 ...

  8. Hadoop的文件读写操作流程

    以下主要讲解了Hadoop的文件读写操作流程: 读文件 读文件时内部工作机制参看下图: 客户端通过调用FileSystem对象(对应于HDFS文件系统,调用DistributedFileSystem对 ...

  9. 深入探索C&plus;&plus;对象模型-1

    概述 在实际生产中,遇到一个复杂的类,如果能看出这个类的内存模型结构,那么以后的操作基本就没有难度的: 所以说,学会分析一个类的内存模型,是每一个C++程序员必须要会的知识. 下面,就让我们来了解C+ ...

  10. nodejs javascript微信开发

    1.当从第三方软件需要分享到微信的时候 需要给授权处理才能获得微信信息 比如 nickname 等昵称图像等 从第三方登陆跳转到微信分享页需要 shareurl = http://open.weixi ...

相关文章