直接上源代码
var msgWindow={
T_div:function (){
var str="<div class=\"T_main\" >\n" +
" <div class=\"T_window\">\n" +
" <div class=\"T_title\"><span>提示</span><a href=\"javascript:;\">X</a></div>\n" +
" <div class=\"T_content\"></div>\n" +
" <div class=\"T_button\"></div>\n" +
" </div>\n" +
"</div>";
$('body').append(str);
},
T_style:function (){
$('.T_main').css('width','100%');
$('.T_main').css('height','100%');
$('.T_main').css('position','fixed');
$('.T_main').css('left','0');
$('.T_main').css('top','0');
$('.T_main').css('background','#808080');
$('.T_main').css('opacity','0.8');
$('.T_window').css('width','35%');
$('.T_window').css('height','40%');
$('.T_window').css('background','#f5f5f5');
$('.T_window').css('border','rgb(12, 87, 240) 1px solid');
$('.T_window').css('position','absolute');
$('.T_window').css('left','32%');
$('.T_window').css('top','20%');
$('.T_window').css('border-radius','5px');
$('.T_window').css('text-align','center');
$('.T_title').css('width','100%');
$('.T_title').css('height','10%');
$('.T_title').css('border-radius','5px');
$('.T_title').css('background','#e0ecff');
$('.T_title').css('text-align','left');
$('.T_title span').css('padding','3% 3% 0');
$('.T_title a').css('text-decoration','none');
$('.T_title a').css('color','#000');
$('.T_title a').css('display','inline-block');
$('.T_title a').css('width','8%');
$('.T_title a').css('height','8%');
$('.T_title a').css('background','rgb(149, 184, 239)');
$('.T_title a').css('text-align','center');
$('.T_title a').css('position','absolute');
$('.T_title a').css('top','0');
$('.T_title a').css('right','5%');
$('.T_title a').click(function(){
$('.T_main').remove();
})
$('.T_content').css('width','80%');
$('.T_content').css('height','74%');
$('.T_content').css('font-size','20px');
$('.T_content').css('color','#64616a');
$('.T_content').css('margin','1% auto');
$('.T_button').css('width','80%');
$('.T_button').css('height','15%');
$('.T_button').css('text-align','right');
$('.T_button').css('margin','0 auto');
$('.T_button').css('line-height','100%');
$('.T_button').append("<button>确定</button>");
$('.T_button button').css('width','15%');
$('.T_button button').css('height','70%');
$('.T_button button').css('background','#e6f0ff');
$('.T_button button').css('border-radius','5px');
$('.T_button button').css('border','0');
$('.T_button button:last').click(function(){
$('.T_main').remove();
})
},
T_window:function (msg){
this.T_div();
$('.T_content').html(msg);
this.T_style();
}
}
效果如图