/**
* 用户强制退出活动弹框
*/
(
function () {
$.
ForceQuitMsgBox = {
forceQuitDialog:
function (title
, msg
, callback
,callback1) {
GenerateHtml(
"confirm", title
, msg)
;
onMouseOver()
;
btnOk(callback)
;
btnNo(callback1)
;
$(
"#mb_btn_no")[
0].
focus()
;
}
}
;
//生成Html
var GenerateHtml =
function (type
, title
, msg) {
var _html =
"";
_html +=
'<div id="mb_box"></div><div id="mb_con"><span id="mb_tit">' + title +
'</span>';
_html +=
'<div id="mb_msg"><img id="mb_warm" src="Public/img/warm.png"><div id="mb_msg_tip">亲！此时退出工作人员将无法联系到您领取实物奖品哦！</div><img id="mb_error" src="Public/img/error.png"></div><div id="mb_btnbox">';
if (type ==
"confirm") {
_html +=
'<input id="mb_btn_ok" type="button" value="执意退出" />';
_html +=
'<input id="mb_btn_no" type="button" value="返回填写" />';
}
_html +=
'</div></div>';
//必须先将_html添加到body，再设置Css样式
$(
"body").
append(_html)
;
//生成Css
GenerateCss()
;
}
;
//生成Css
var GenerateCss =
function () {
$(
"#mb_box").css({
width:
'100%', height:
'100%', zIndex:
'99999', position:
'fixed',
filter:
'Alpha(opacity=60)', backgroundColor:
'black', top:
'0', left:
'0', opacity:
'0.6'
})
;
$(
"#mb_con").css({
zIndex:
'999999', width:
'1100px', position:
'fixed',height:
"571px",
backgroundColor:
'white', borderRadius:
'65px'
})
;
$(
"#mb_tit").css({
display:
'block', backgroundColor:
'red', borderRadius:
'65px 65px 0 0',height:
'111px'})
;
$(
"#mb_msg").css({
height:
'360px',width:
'100%'})
;
$(
"#mb_warm").css({
marginTop:
'68px',marginLeft:
'83px',float:
'left'})
;
$(
"#mb_error").css({
marginTop:
'68px',marginRight:
'75px',float:
'right'})
;
$(
"#mb_msg_tip").css({
marginTop:
'127px',marginLeft:
'10px',float:
'left',width:
'450px',fontSize:
'34px',fontFamily:
"方正大黑简体",color:
'#ff0000'})
;
$(
"#mb_btnbox").css({
margin:
'15px 0 0 0', textAlign:
'center' })
;
$(
"#mb_btn_ok,#mb_btn_no").css({
fontSize:
'46px',width:
'327px', height:
'77px', color:
'#fff', border:
'none',borderRadius:
'65px',fontFamily:
"黑体" ,outline:
'none' })
;
$(
"#mb_btn_ok").css({
backgroundColor:
'#ff6262',marginLeft:
'0px'})
;
$(
"#mb_btn_no").css({
backgroundColor:
'#ff6262',marginLeft:
'46px' })
;
//右上角关闭按钮hover样式
$(
"#mb_ico").hover(
function () {
$(
this).css({
backgroundColor:
'Red', color:
'White' })
;
}
, function () {
$(
this).css({
backgroundColor:
'#DDD', color:
'black' })
;
})
;
var _width =
document.
documentElement.
clientWidth; //屏幕宽
var _height =
document.
documentElement.
clientHeight; //屏幕高
var boxWidth = $(
"#mb_con").
width()
;
var boxHeight = $(
"#mb_con").
height()
;
//让提示框居中
$(
"#mb_con").css({
top: (_height - boxHeight) /
2 +
"px", left: (_width - boxWidth) /
2 +
"px" })
;
}
;
//确定按钮事件
var btnOk =
function (callback) {
$(
"#mb_btn_ok").
click(
function () {
$(
"#mb_box,#mb_con").
remove()
;
if (
typeof (callback) ==
'function') {
callback()
;
}
})
;
}
;
//取消按钮事件
var btnNo =
function (callback1) {
$(
"#mb_btn_no").
click(
function () {
$(
"#mb_box,#mb_con").
remove()
;
if (
typeof (callback1) ==
'function') {
callback1()
;
}
})
;
}
;
function onMouseOver() {
$(
"#mb_btn_no").mouseover(
function () {
$(
"#mb_btn_no").css({
backgroundColor:
'#ff6262' })
;
})
;
$(
"#mb_btn_no").mouseleave(
function () {
$(
"#mb_btn_no").css({
backgroundColor:
'red'})
;
})
;
$(
"#mb_btn_ok").mouseover(
function () {
$(
"#mb_btn_ok").css({
backgroundColor:
'#ff6262' })
;
})
;
$(
"#mb_btn_ok").mouseleave(
function () {
$(
"#mb_btn_ok").css({
backgroundColor:
'red'})
;
})
;
$(
"#mb_btn_no").
focus(
function () {
$(
"#mb_btn_no").css({
backgroundColor:
'red' })
;
})
;
$(
"#mb_btn_no").
blur(
function () {
$(
"#mb_btn_no").css({
backgroundColor:
'#ff6262'})
;
})
;
$(
"#mb_btn_ok").
focus(
function () {
$(
"#mb_btn_ok").css({
backgroundColor:
'red' })
;
})
;
$(
"#mb_btn_ok").
blur(
function () {
$(
"#mb_btn_ok").css({
backgroundColor:
'#ff6262'})
;
})
;
}
;
})()
;
转载请注明原文地址: https://ju.6miu.com/read-18611.html
