js代码
var Tips = {
prize:function(win){
var message = {0:{title:'领取成功',msg1:'恭喜您!',msg2:'已成功领取XX'},
1:{title:'领取失败',msg1:'您尚还未满足领取条件,',msg2:'请先查看活动说明哦!'},
2:{title:'领取失败',msg1:'今天已经领取',msg2:'请明天再来哦。'},
3:{title:'领取失败',msg1:'您尚还未满足领取条件,',msg2:'先进行实名再来哦。'},
4:{title:'领取失败',msg1:'您尚还未满足领取条件,',msg2:'消费未达标哦。'},
5:{title:'领取失败',msg1:'您尚还未满足领取条件,',msg2:'不在活动时间内哦。'},
}
var _template = "<div class='tips'>"+
"<div class='tips-prize'>" +
"<h2 class='title'>{{title}}</h2>"+
"<p class='message'>{{msg1}}</p>"+
"<p class='message'>{{msg2}}</p>"+
"</div>" +
"<div class='tips-btns'><a class='btn btn-ok'>确定</a></div>" +
"</div>"+
"<div class='mask'></div>"; //重点在这 设置mask
var msgobj = message[win];
_template = _template.replace("{{title}}",msgobj['title']);
_template = _template.replace("{{msg1}}",msgobj['msg1']);
_template = _template.replace("{{msg2}}",msgobj['msg2']);
//中奖时给出背景
if(win==0){
_template = _template.replace("tips-prize","tips-prize");
}
$("body").append(_template);
this.close();
},
css样式
/**tips dialog*/
.tips{position:fixed;left:50%;top:50%;width:5.7rem;height:5.44rem;margin-top:-2.72rem;margin-left:-2.85rem;z-index:1000;background:#fff;border-radius:0.1rem}
.mask{position:fixed;width:100%;height:100%;left:0;top:0;z-index:999;background:rgba(0,0,0,0.5);}
重点给tips和mask加属性z-index