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

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

<!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 type="text/javascript" src="http://www.jincon.com/include/jscript/jquery.js?ver=1.7.1"></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>

上一篇: 简单方法实现mysql查询分组后获取结果集总数SQL语句
下一篇: php操作更新svn提示Can’t open file ‘.svn/lock’: Permission denied的解决方法

目前还没有人评论,您发表点看法?
发表评论

评论内容 (必填):