用于ajax类型提示的，只显示一个。
只是给个思路而已，代码有很多不足。
4个参数，有2个是可选
调用
$.mTip('类型','显示内容',显示时间,回调函数)
类型：
0 为加载
1 为成功
2 为失败
3 为警告
显示时间：
为整数型
大于0，
小于0或非整数一直存在，不消失！
效果图：
渣渣效果一份：
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>提示框</title> <style type="text/css"> .msgbox_layer, .msgbox_layer .gtl_ico_succ, .msgbox_layer .gtl_ico_fail, .msgbox_layer .gtl_ico_hits, .msgbox_layer .gtl_ico_clear, .msgbox_layer .gtl_end {background-image: url("images/gb_tip_layer.png");background-repeat: no-repeat;color: #606060;display: inline-block;font-size: 14px;font-weight: bold;height: 54px;line-height: 54px;} .msgbox_layer_wrap {left: 0;position: fixed;_position: absolute;_top: expression(documentElement.clientHeight/2 + documentElement.scrollTop + "px");text-align: center;top: 46%;width: 100%;z-index: 65533;} .msgbox_layer {background-position: 0 -161px;background-repeat: repeat-x;margin: 0 auto;padding: 0 18px 0 9px;position: relative;} .msgbox_layer .gtl_ico_succ {background-position: -6px 0;left: -45px;position: absolute;top: 0;width: 45px;} .msgbox_layer .gtl_end {background-position: 0 0;position: absolute;right: -6px;top: 0;width: 6px;} .msgbox_layer .gtl_ico_fail {background-position: -6px -108px;left: -45px;position: absolute;top: 0;width: 45px;} .msgbox_layer .gtl_ico_hits {background-position: -6px -54px;left: -45px;position: absolute;top: 0;width: 45px;} .msgbox_layer .gtl_ico_clear {background-position: -6px 0;left: -5px;position: absolute;top: 0;width: 5px;} .msgbox_layer img {float: left;margin: 19px 10px 0 5px;width: 16px;height: 16px;} .manhuaTip{ width:80px; height:40px; line-height:40px; text-align:center; border:1px #999999 solid; background:#82ce18; margin-right:50px; font-size:16px; font-weight:bold; letter-spacing:2px; cursor:pointer; color:#FFF; } </style> </head> <body> <input type="button" value='加载中' id="demo"> <input type="button" value='成功' id="demo2"> <input type="button" value='失败' id="demo3"> <input type="button" value='警告' id="demo4"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $("#demo").click(function(){ $.mTip('0','加载中',0); }); $("#demo2").click(function(){ $.mTip('1','成功',0); }); $("#demo3").click(function(){ $.mTip('2','失败',0); }); $("#demo4").click(function(){ $.mTip('3','警告',0); }); function log(a){console.log(a)} $.extend({ mTip:function(type,txt,time,callback){ if($("#mTip").length){ $("#mTip").remove(); } var arrayHTML = [ '<img alt="" src="images/loading.gif">', '<span class="gtl_ico_succ"></span>', '<span class="gtl_ico_fail"></span>', '<span class="gtl_ico_hits"></span>' ]; var temp = type ? arrayHTML[type] : arrayHTML[0]; var html = '<div id="mTip" class="msgbox_layer_wrap"><span id="mode_tips_v2" style="z-index: 10000;" class="msgbox_layer"><span class="gtl_ico_clear"></span>'; html+= arrayHTML[type] + txt + '<span class="gtl_end"></span></span></div>'; $("body").append(html); if(typeof time == 'number'){ if(time > 0){ setTimeout(function(){ $("#mTip").remove(); if(callback){ callback(); } },time); }else{ setTimeout(function(){ if(callback){ callback(); } },100); } } } }); </script> </body> </html>
下载地址：http://files.cnblogs.com/yyman001/mTip1.0.rar