自己练手的一个jquery消息提示插件 - Scripts 学盟

@charset "utf-8";
#system-message {
margin-bottom: 10px;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0;
}
#system-message dt {
display: none;
font-weight: bold;
}
#system-message dd {
font-weight: bold;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
text-indent: 30px;
}
#system-message dd ul {
background-position: 4px top;
background-repeat: no-repeat;
border-bottom-color: #84A7DB;
border-bottom-style: solid;
border-bottom-width: 3px;
border-top-color: #84A7DB;
border-top-style: solid;
border-top-width: 3px;
color: #0055BB;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
margin-bottom: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
}
#system-message dd ul li {
line-height: 1.5em;
}
#system-message dd.message ul {
background-color: #C3D2E5;
background-image: url("../images/notice-info.png");
}
#system-message dd.error ul,#system-message dd.warning ul,#system-message dd.notice ul
{
color: #CC0000;
}
#system-message dd.error ul {
background-color: #E6C0C0;
background-image: url("../images/notice-alert.png");
border-bottom-color: #DE7A7B;
border-top-color: #DE7A7B;
}
#system-message dd.warning ul {
background-color: #E6C8A6;
background-image: url("../images/notice-note.png");
border-bottom-color: #FFBB00;
border-top-color: #FFBB00;
color: #CC0000;
}
#system-message dd.notice ul {
background-color: #EFE7B8;
background-image: url("../images/notice-note.png");
border-bottom-color: #F0DC7E;
border-top-color: #F0DC7E;
color: #CC0000;
}
/*=S 编辑器图片来源提示 */
.editor_hint {
width: auto;
margin-bottom: 0px;
border: 1px solid #F8E8AB;
background-color: #FFF9E2;
color: #909188;
overflow: hidden;
position: relative;
min-height: 20px;
_height: 20px;
}
.editor_hint:after {
clear: both;
display: block;
content: ""
}
.editor_hint span {
text-indent: 0;
float: left
}
.editor_hint span a, /*.editor_hint a{color:#CE0201!important;}*/
.editor_hint span a:link,.editor_hint span a:active {
text-decoration: underline;
}
.editor_hint span a:hover,.editor_hint span a:visited {
text-decoration: underline;
}
.bt_hint_close {
font-family: verdana;
color: #D43A04;
font-weight: bold;
cursor: pointer;
font-size: 12px;
position: absolute;
right: 5px;
top: 6px;
}
.editor_hint_cont {
padding: 5px 15px 5px 5px;
}
.editor_hint_cont .icon_hint {
margin-right: 5px;
position: static;
}
/* 文本框加载 */
.cg_loading {
background-image: url("../images/ajax_small.gif");
background-position: 100% 2px;
background-repeat: no-repeat;
background-color: #D5EEFF;
}
/* 文本框加载 */
.cg_loading {
background-position: 100% 2px;
background-repeat: no-repeat;
background-color: #D5EEFF;
background-image: url("../images/loading.gif") ;
}
.ok_icon {
background-position: 100% 2px;
background-repeat: no-repeat;
background-color: #D5EEFF;
background-image: url("../images/accept.png");
}
.notok_icon {
background-position: 100% 2px;
background-repeat: no-repeat;
background-color: #D5EEFF;
background-image: url("../images/exclamation.png");
}

复制代码

/**
* type: Information reminder types; The rid_device_info: common information, error messages, warn as freely though they are: warning: the information
*
* isVanish: Whether timing hidden. Default automatic hidden
* vanish: Disappear time, the default for 3 seconds (3000 milliseconds)
* content: prompt message.
*
* @author wucc Created on 2011.07.13
*/
(function($){
$.fn.message = function(options){
var defaults = {
type :"info",// 信息提示类型；info：普通信息，error：错误信息，warn：警告信息
isVanish:true, // 是否定时隐藏默认自动隐藏
vanish :1500, // 消失时间 ,默认为1500毫秒）
content :escape("提示信息")
}
var div=$(this);
var options = $.extend(defaults, options);
this.each(function(){
if('object' == typeof(options))
{
var type = options.type.toLowerCase();
if(type == "info"){
var html ='<dl id="system-message"><dt class="message">消息</dt><dd class="message message"><ul><li>'+options.content+'</li></ul></dd></dl>';
div.hide();
div.html(html)
div.show("1000");
}else if(type == "error"){
var html ='<dl id="system-message"><dt class="error">错误</dt><dd class="error message"><ul><li>'+options.content+'</li></ul></dd></dl>';
div.hide();
div.html(html)
div.show("1000");
}else if(type == "warn"){
var html ='<dl id="system-message"><dt class="notice">注意</dt><dd class="notice message"><ul><li>'+options.content+'</li></ul></dd></dl>';
div.hide();
div.html(html)
div.show("1000");
}else if(type == "editor"){
var html = '<div style="height: auto;" class="editor_hint" id="qzEditor_1_tips"><div class="editor_hint_cont">'+options.content+'</div></div>';
div.hide();
div.html(html)
div.show("1000");
}
if(options.isVanish){
setTimeout(function(){div.hide(options.vanish,function(){div.html("");})},options.vanish);
}
}
});
};
})(jQuery);

复制代码