漫画原创Jquery消息提示插件

dengjianbin 12年前
一共有4种提示操作：
1、错误（error） 
 2、 成功（succ） 
 3、消息（notice） 
4、等待（loading）

每个使用的元素加上以下3种属性  
1、class必需为manhuaTip  
2、 ty类别必需为第一条的4种之一  
3、msg提示的消息
 
可以灵活设置响应事件和显示时间
 
Jquery插件,Jquery资源,Jquery特效,div+css
Jquery插件,Jquery资源,Jquery特效,div+css
Jquery插件,Jquery资源,Jquery特效,div+css
Jquery插件,Jquery资源,Jquery特效,div+css

插件源代码如下：
$(function() {   $.fn.manhuaTip = function(options) {    var defaults = {     Event : "click",     timeOut : 2000    };    var options = $.extend(defaults,options);    var $tip = $(this);    //文本框绑定事件    $tip.live(options.Event,function(e){      var type = $(this).attr('ty');       var msg = $(this).attr('msg');       var tipHtml = '';     if (type =='loading'){      tipHtml = '<img alt="" src="images/loading.gif">'+(msg ? msg : '正在提交您的请求，请稍候...');     } else if (type =='notice'){      tipHtml = '<span class="gtl_ico_hits"></span>'+msg     } else if (type =='error'){      tipHtml = '<span class="gtl_ico_fail"></span>'+msg     } else if (type =='succ'){      tipHtml = '<span class="gtl_ico_succ"></span>'+msg     }     if ($('.msgbox_layer_wrap')) {      $('.msgbox_layer_wrap').remove();     }     if (st){      clearTimeout(st);     }     $("body").prepend("<div class='msgbox_layer_wrap'><span id='mode_tips_v2' style='z-index: 10000;' class='msgbox_layer'><span class='gtl_ico_clear'></span>"+tipHtml+"<span class='gtl_end'></span></span></div>");     $(".msgbox_layer_wrap").show();     var st = setTimeout(function (){      $(".msgbox_layer_wrap").hide();      clearTimeout(st);     },options.timeOut);    });    }  });