jq 插件化 自消失消息提示

js

//arm信息提示模块
function arm(str,type,addition){
  var type=(typeof(type)=="undefined")?"":type;
  var life;
  switch (type) {
    case "warning":
      life=10000;
      break;
    case "danger":
      life="long"
      break;
    case "info":
      life=10000;
      break;
    default:
      type="default";
      life=10000;
  }
  ac=new armContant();
  ac.create(str,type,life,addition)
}
var armcount=0;
function armContant(){
  this.armid=++armcount;
  var that = this;

  this.color;
  this.life;
  this.text;
  this.addition;
  this.content;
  this.closebtn=function(){
    var span =document.createElement("span");
    span.innerHTML="X";
    span.className="arm_btn_close";
    span.addEventListener("click",that.close);
    return span;
  }
  this.colorArr={
    "warning":["#F2753F","#FFFC66"],
    "danger":["#D53627","#F5F6EB"],
    "info":["#57D2F7","#666"],
    "default":["#00C4AB","#fff"],
  };
  this.create=function(){
    that.text=arguments[0];
    that.color=that.colorArr[arguments[1]];
    that.life=arguments[2]
    that.addition=arguments[3];
    //大容器
    that.content=document.createElement("div");
    that.content.className="arm_bigcon";
    that.content.style.background=that.color[0];
    that.content.style.color=that.color[1];
    that.content.setAttribute("armid",that.armid);

    // 图标容器
    var imgIcon = document.createElement("div");
    // imgIcon.className = "arm_icon_logo";
    imgIcon.className = "arm_icon_logo";
    imgIcon.innerHTML = "小冰军机处";
    that.content.appendChild(imgIcon);

    //-文字容器
    var strcon=document.createElement("div");
    strcon.className="arm_con";
    that.content.appendChild(strcon);

    //--文字
    var span=document.createElement("span");
    span.className="arm_str_main";
    span.innerHTML=that.text;
    strcon.appendChild(span)

    //--额外内容
    if(!!that.addition){
      strcon.appendChild(that.addition);
    }
    //--关闭按钮
    that.content.appendChild(that.closebtn());

    document.body.appendChild(that.content);
    if(that.life!="long"){
      setTimeout(that.close,that.life);
    }

  }
  this.close=function(){
    $("[armid="+that.armid+"]").remove();
  }
}

css

@charset "UTF-8";
/*arm*/
.arm_bigcon{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99;
}
.arm_con{
  position: relative;
  margin: auto;
  left: 0;right: 0;
  top:0;
  padding:10px;
  width: 400px;
}
.arm_btn_close{
  position: absolute;
  margin: auto;
  top:0;bottom: 0;
  right:0;
  width: 20px;height:20px;
  cursor: pointer;
}
.arm_icon_logo{
  position: absolute;
  margin: auto;
  top:0;bottom: 0;
  left:0;
  line-height: 40px;
  height:40px;
  width:100px;
  padding:0 10px;
  /*background: url(../images/miniice.png) no-repeat;*/
  /*background-color: #fcfcfc;*/
  font-family: "microsoft yahei";
  background-position: center;
  background-size: 100% auto;

}