jquery实现弹出即消失的提示层

作者：编程知识库发布：2014-03-02 分类：Jquery 阅读：3,071次

<!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>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></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实现弹出即消失的提示层 - 编程知识库

该文章由编程知识库发于2014年03月02日发表在Jquery分类下，你可以至底部留下评论。

原创文章转载请注明: jquery实现弹出即消失的提示层 | 编程知识库

上一篇：css和js禁止网页选择文字

下一篇：jquery artDialog对话框弹出层插件实测和美化

您可能还会对这些文章感兴趣

雷军22年前写的程序代码保准你没见过！

作为小米科技的创始人、董事长和首席执行官，雷军的名字如雷贯耳。上午W3Cschool发布了一篇“刘强东的代码水平如何”(有兴趣的可以点击右上角关注我们)的文章，有网友在下面回复“代码只服雷军”。这个回复吸引了W3Cschool的注...
只会用jQuery前端到底low不low?

如果你之前没有看过我的《前端工程师如何月薪过4万》这里建议大家仔细读读一下，因为里面有整个前端工程师成长的技术路线图和我的故事。同时很多小伙伴问我的学历后来没再考考么，我是考了成考的北京航空航天大学，也马上快...
UED原型设计工具Axure汉化版

Axure汉化版已经发布，版本号Axure 5.1.0.1699，下面是截图效果 Axure汉化版文件下载地址：Axure汉化补丁 Axure RP pro 5.1.0.1699 下载地址注册用户名：Axure 序列...
百度公共DNS无劫持IP 从此上网无阻

今天百度推出公共DNS服务，IP地址为180.76.76.76，号称拥有遍布全国的递归出口节点，可以做到更稳定，纯净无劫持等。 DNS在现有整个互联网基础架构中也扮演着流量”调度员”、”指引员”的角色。尽管已经有超过30年历史,DNS仍...
小伙打造网站媒体帝国月访问量4500万

　　BI中文站 6月7日报道艾默生·斯帕茨(Emerson Spartz)今年28岁，已婚，是Spartz Inc公司的首席执行官。Spartz Inc是一个网站媒体帝国，旗下的30多家网站专门发布有趣、励志和让人感到不可思议的文章和帖子，其分享量非常...

jquery实现弹出即消失的提示层

您可能还会对这些文章感兴趣

大家正在看

推荐阅读

全部分类

本月热门