html 彈框 優化 alert
阿新 • • 發佈：2018-11-16
<!DOCTYPE html> <html> <head> <title>cs</title> </head> <style type="text/css"> .aa{ width: 224px; height: 35px; padding-top: 9px; text-align:center; /*background-color:#ccc;*/ /*filter:alpha(Opacity=80);*/ /*-moz-opacity:0.5;*/ /*opacity: 0.7;*/ /*border-radius:20px;*/ } #msg{ height: 2rem; text-align: center; position: fixed; top: 50%; margin-top: -1rem; line-height: 2rem; width: 100%; } #msg span{ color: #fff; background: rgba(0,0,0,0.6); height: 2rem; display: inline-block; padding: 0 3rem; border-radius: 5px; } </style> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <body> <div class="aa">播放完成 才能快取下載哦！！</div> </body> <script type="text/javascript"> alert('asaogi') function alert(e){ $("body").append("<div id='msg'><span>"+e+"</span></div>"); clearmsg(); } function clearmsg(){ var t = setTimeout(function(){ $("#msg").remove(); },2000) }; </script> </html>