首页 > 代码库 > jquery实现弹出即消失的提示层
jquery实现弹出即消失的提示层
<!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>
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。