<!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. 生产环境下Centos 6.5优化配置 （装载）

    本文 centos 6.5 优化 的项有18处: 1.centos6.5最小化安装后启动网卡 2.ifconfig查询IP进行SSH链接 3.更新系统源并且升级系统 4.系统时间更新和设定定时任 5. ...

  2. ModelSim仿真入门

    ModelSim仿真入门之一:软件介绍 编写这个教程之前,为了让不同水平阶段的人都能阅读,我尽量做到了零基础入门这个目标,所有的操作步骤都经过缜密的思考,做到了详细再详细的程度. 如果您是FPGA开发 ...

  3. WPC文件修改还原pin进度

    原文地址:http://wenku.baidu.com/link?url=KZRR6VtW_Yn59iEbrWYz15jOH6hSVgjyow8nvwHfQr3eQgvCcc9IgYCT-fWwVWf ...

  4. DES加解密实现方式

    private static readonly byte[] _keys = { 0x22, 0x84, 0x56, 0x98, 0x90, 0xAB, 0xpD, 0xEF }; private s ...

  5. jquery easyui tree绑定静态数据的方法

    若是动态,返回的是json格式,这个比较常见,就不列举说明了,如果要绑定的数据为静态,很简单,只需将ajax的url改为data 如 //鼠标单击树事件 $("#tree").tr ...

  6. HDU_2052——画矩形

    Problem Description Give you the width and height of the rectangle,darw it.   Input Input contains a ...

  7. 程序设计实习MOOC / 继承和派生——编程作业 第五周程序填空题1

    描述 写一个MyString 类,使得下面程序的输出结果是: 1. abcd-efgh-abcd- 2. abcd- 3. 4. abcd-efgh- 5. efgh- 6. c 7. abcd- 8 ...

  8. jquery $.each()用法

    今天看到一个新的each玩法即each作为jquery的函数(平时用的大概都是用的each方法)使用: $.each([ 52, 97 ], function( index, value ) { al ...

  9. (转)OS X Mountain Lion 系统配置 Apache+Mysql+PHP 详细教程

    如果你是一名 Web 开发者,很多时候都需要在本地搭建服务器测试环境,比如 Apache+Mysql+PHP 这样的环境.事实上 Mac OS X 中想要搭建这样的环境很简单,本文我们就会将详细的教程 ...

  10. ApacheBench~网站性能测试工具

    对于网站性能测试来说,一般我们会使用loadrunner来实现,而它过于庞大,使我们感到有些不爽,而今天介绍的ApacheBench工具,它小而精,使用简单,效果直观,可以说,是比lr更好用的性能测试 ...