<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

 <head>

     <title></title>

     <meta charset="utf-8"/>

     <script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>

     <script type="text/javascript">

         $(function () {

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

                 $("#dv").slideToggle(200);

                 setTimeout(function () {

                     $("#dv").hide(200);

                 }, 3000);

             });

         });

     </script>

     <style type="text/css">

         div.RoundedCorner

         {

             background: #C8E2FA;

         }

         b.rtop, b.rbottom

         {

             display: block;

             background: #FFFFFF;

         }

         b.rtop b, b.rbottom b

         {

             display: block;

             height: 1px;

             overflow: hidden;

             background: #C8E2FA;

         }

         b.r1

         {

             margin: 0 5px;

         }

         b.r2

         {

             margin: 0 3px;

         }

         b.r3

         {

             margin: 0 2px;

         }

         b.rtop b.r4, b.rbottom b.r4

         {

             margin: 0 1px;

             height: 2px;

         }

         #dv

         {

             width: 300px;

             position: absolute;

             top: 10px;

             left: 39%;

             z-index: 10001;

             padding: 0;

         }

         .shade

         {

             display: none;

         }

     </style>

 </head>

 <body>

     <div id="dv" class="shade">

         <b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4">

         </b></b>

         <div style=" height:100px; text-align:center; background-color:#C8E2FA;">

         <br /><br />

             <div style="height:30px; font-weight: bold; font-size:16px; background-color:#C8E2FA;">

                 修改成功!

             </div>

         </div>

          <b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2">

         </b><b class="r1"></b></b>

     </div>

     <input type="button" id="btn" value="点击" />

 </body>

 </html>

jquery实现弹出即消失的提示层的更多相关文章

  1. jquery制作弹出层带遮罩效果，点击阴影部分层消失

    jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...

  2. js简单显示和隐藏div，触发超链接，动态更改button值，setInterval（）简单使用，jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  3. iOS开发实用技巧—在手机浏览器头部弹出app应用下载提示

    iOS开发实用技巧—在手机浏览器头部弹出app应用下载提示 本文介绍其简单使用: 第一步:在本地建立一个访问的服务端.  打开本地终端,在本地新建一个文件夹,在该文件夹中存放测试的html页面.   ...

  4. jQuery Dialog弹出层对话框插件

    Dialog.js的相关注释已经添加,可以按照注释,进行相关样式的修改,适用于自定义的各个系统! dialog.js /** * jQuery的Dialog插件. * * @param object ...

  5. JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法(转）

    原文:JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法 jquery-easyui是一个基于jquery的图形界面插件,利用easyui可以创建很多好看的网页界面 ...

  6. jquery 简单弹出层(转)

    预定义html代码:没有 所有代码通过js生成和移除. 预定义css /* 基本弹出层样式 */ .my-popup-overlay { width:100%; height:auto; /* wid ...

  7. jQuery.reveal弹出层

    jQuery.reveal弹出层使用 最近用到弹出层,还得自定义UI,原本用的artDialog太庞大,不合适了,于是就找到了这个东西,又小又好用,基础的弹出遮罩都有了,想要什么还不是Coder自己说 ...

  8. CSS3/jQuery自定义弹出窗口

    简单演示一下,精简了演示效果和css样式文件,更利于在项目中的实际应用 引入style.css   index.js <!DOCTYPE HTML PUBLIC "-//W3C//DT ...

  9. 设置电脑中的某个程序不弹出UAC用户控制提示的方法

    有用户发现在电脑开机后总是会弹出UAC用户账户控制窗口,这是因为电脑中的某个程序设置了开机启动,这样就会在开机后启动该程序时出现UAC提示.如果想要省略该提示,可以在电脑中设置该程序不弹出UAC用户控 ...

随机推荐

  1. nginx 中location和root

    nginx 中location和root,你确定真的明白他们关系? 2016-01-17 14:48 3774人阅读 评论(1) 收藏 举报  分类: linux(17)  版权声明:本文为博主原创文 ...

  2. angular controller js 压缩后报错解决方案

    简单介绍下ng-annotate这个项目,这个项目正好提供了gulp的插件. gulp配置文件: var gulp = require('gulp'); var ngAnnotate = requir ...

  3. 复杂事件处理引擎—Esper参考（事件部分）

    声明:Esper官方未提供中文文档,以后更新的大部分内容,均来自官方文档.本人英语小白一枚,翻译内容仅供参考.有些翻译确实不忍直视,君可略过. (有人可能会说,翻译的不好不如不翻,可能会误人子弟:不过 ...

  4. Linux里面怎样修改主机名

    第一步:hostname 修改后的主机名 第二步:修改/etc/sysconfig/network中的hostname第三步:修改/etc/hosts文件 示例: 我机器现在的主机名是pc,想修改成t ...

  5. MYSQL正式环境主从复制（不锁表，不停服务）

    参考URL: http://rfyiamcool.blog.51cto.com/1030776/1016636/ 原因源于其实以前环境是有MYSQL主从复制的,且最开始主从复制之间是OK的. 但由于日 ...

  6. Qt编程之QString 处理换行

    由于之间写过的一篇文章,Unix,windows,Mac里面的换行符不一样,导致处理也不一样,我现在要用QString以行分割(读取的文本文件的里面有换行符).所以要通吃这三种换行符 http://w ...

  7. 8.2.1.10 Nested-Loop Join Algorithms 嵌套循环 关联算法:

    8.2.1.10 Nested-Loop Join Algorithms 嵌套循环 关联算法: MySQL 执行关联在表之间使用一个嵌套循环算法或者变种 Nested-Loop Join Algori ...

  8. google开源的C++性能分析工具 - gperftools

    gperftools是Google提供的一套工具,其中的一个功能是CPU profiler,用于分析程序性能,找到程序的性能瓶颈. 安装 gperftools:http://code.google.c ...

  9. 基于HTML5 Canvas的饼状图表实现教程

    昨天我们分享了一款基于HTML5的线性图表应用,效果非常不错,可以看在线DEMO或者实现教程.今天我们继续来分享一款基于HTML5的网页图表,它也是利用Canvas绘制的,但是和前面不同的是,这款图表 ...

  10. 使用 PIVOT 和 UNPIVOT 行转列 列转行 报表统计 函数

    官方文档:http://technet.microsoft.com/zh-cn/library/ms177410(v=SQL.105).aspx 可以使用 PIVOT 和 UNPIVOT 关系运算符将 ...