<!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. 包含无数好东西的ownCloud

    ownCloud 是一个来自 KDE 社区开发的免费软件,提供私人的 Web 服务.当前主要功能包括文件管理(内建文件分享).音乐.日历.联系人等等,可在PC和服务器上运行. 简单来说就是一个基于Ph ...

  2. 模糊语意变数、规则和模糊运算--AForge.NET框架的使用（二）

    原文:模糊语意变数.规则和模糊运算--AForge.NET框架的使用(二) 语意变数(Linguistic Variable) 语意变数存储了数个语意量(标签),每个语意量包含一个识别名和模糊集合.在 ...

  3. BZOJ3402: [Usaco2009 Open]Hide and Seek 捉迷藏

    3402: [Usaco2009 Open]Hide and Seek 捉迷藏 Time Limit: 3 Sec  Memory Limit: 128 MBSubmit: 51  Solved: 4 ...

  4. 【细说Java】Java的重写与隐藏

    重写与隐藏,有些书上或介绍上可能名称不一样,但都大差不差.以前只了解重写,隐藏也听说过,但没有详细了解过,趁现在,整理一下这两方面的内容吧. 首先,先说一下概念方面的东西. 重写 重写:子类继承了父类 ...

  5. Android中使用shape制作一个旋转的progressbar

    public class ZNtestResActivity extends Activity { @Override public void onCreate(Bundle savedInstanc ...

  6. JDBC连接mysql编程

    基本操作 package jdbc; import java.sql.Statement; import java.util.Scanner; import java.sql.Connection; ...

  7. SQL-Customers Who Never Order

    Suppose that a website contains two tables, the Customers table and the Orders table. Write a SQL qu ...

  8. 远程连接mysql

    win系统下,连接别人的mysql或者让别人链接自己的mysql: 打开命令行cmd 进入mysql: mysql -u root -p mysql>use mysql;  mysql>s ...

  9. 【转】Eclipse中创建并运行Servlet项目

    最近看了写http协议的学习资料,因此想要实现下andriod平台和服务器通信,那就servlet吧,哎哟,还不错哦!顺便说下,我这个servlet服务是想获得用户名和密码进行校验,然后反给客户端状态 ...

  10. Nginx各个配置块功能详解

    Nginx学习笔记-入门篇 nginx初探 ginx服务器是轻量级web服务器中广受好评的一款产品,常用功能有HTTP代理与反向代理(目前已支持七层与四层代理),负载均衡,web缓存. nginx配置 ...