首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

jquery兑现索屏

2012-06-27 
jquery实现索屏Messages {//简单显示消息showMsg : function(msg){this.popupMessages(0,msg)},//简单

jquery实现索屏
Messages = {

//简单显示消息
showMsg : function(msg){
this.popupMessages(0,msg);
},

//简单显示消息并带确定按钮
okMsg : function(msg){
this.popupMessages(1,msg);
},
//简单显示消息并带确任,取消按钮(未实现)
confirmMsg : function(msg){
this.popupMessages(2,msg);
},

/********************************************锁屏***************************************************/
//打开
openLoadingDiv : function(){
var strDiv="<div id='loadImgDiv' style='background-color: #ffffe1;z-Index:10001;border:1px solid;border-color: silver;width:140px;position: absolute;left:"+(document.body.clientWidth-120)/2+";top:"+(document.body.clientHeight-25)/2+"'>"+
"<table align='center'>"+
"<tr>"+
"<td>"+
"<img style='height:22px;width:22px' src='"+Utils.getRootPath()+"/root/images/loading4.gif'/>"+
"</td>"+
"<td style='font-size: 15px;'>"+
"数据处理中..."+
"</td>"+
"</tr>"+
"</table>"+
"</div>";
$("select").attr("disabled","disabled");
this.openShadeDiv();
$("body").append(strDiv);
},

//遮罩层
openShadeDiv : function(){
var wnd = $(window);
var doc = $(document);
var wHeight=0;
var wWidth=0;
//当高度少于一屏
    if(wnd.height()>doc.height()){
     wHeight = wnd.height();
     wWidth = wnd.width();
    }else{
    //当高度大于一屏
     wHeight = doc.height();
     wWidth = doc.width();
    }
//创建遮罩背景
$("body").append("<div id=shadeDiv></div>");
$("body").find("#shadeDiv")
    .width(wWidth)
    .height(wHeight)
    .css({
    position:"absolute",
    top:"0px",left:"0px",
    background:"#ccc",
    filter:"Alpha(opacity=50);",
    opacity:"0.3",zIndex:"10000"
    });
},

//关闭
closeLoadingDiv  : function(){
$("select").attr("disabled","");
$("#shadeDiv").remove();
$("#loadImgDiv").remove();
},

/**************************************操作完成后加载显示提示信息*******************************************/
/**
* 执行操作操作后相应操作结果
*/
popupMessages : function(tepy, msg){

//定义操作提示层.
//background='"+Utils.getRootPath()+"/root/images/messages.gif'
//<div id='messagesLayer' style='border:1px solid red; width:200px ;  position:absolute ;100px; right: 50%; top: 0px;' >
var popUpDiv="<div id='messagesLayer' style='width:244px; heigth:auto; position:absolute ;100px; right: 50%; top: 0px; display:none; z-Index:11000;'>"+
"<table width='244' height='172' id='messagesTable' cellpadding='0' cellspacing='0' background='"+Utils.getRootPath()+"/root/images/msg_bg.gif' style='background-repeat:repeat;' >"+
"<tr>"+
"<td width='189' height='26'></td>"+
"</tr>"+
"<tr>"+
    "<td align='center' valign='middle'>"+
      "<div style='width:220px;><font style='font-size: 12px;'>"+(msg)+"<br><br></font><div>"+
        "</td>"+
    "</tr>"+
"</table>"+
"</div>";

$("#messagesLayer").remove();
if(tepy == 0){
$("body").append(popUpDiv);
$("#messagesLayer").slideDown(1000); 
//延迟2秒钟后隐藏提示层.
setTimeout(function (){
$("#messagesLayer").slideUp();
}, 3000);
}
if(tepy == 1){
$("body").append(popUpDiv);
$("#messagesLayer").slideDown(1000);
$("#messagesTable").append("<tr><td align='right'><span style='algin:right;'>确定</span></td></tr>");
}
if(tepy == 2){
this.openLoadingDiv();
$("body").append(popUpDiv);
$("#messagesLayer").slideDown(1000); 
$("#messagesTable").append("<tr><td align='right'><a href='#'>确定</a>&nbsp;&nbsp;&nbsp;<a href='#' onclick='javascript:Message.closeLoadingDiv();$("#messagesLayer").slideUp();'>取消</a>&nbsp;&nbsp;&nbsp;</td></tr>");
}
}
}

热点排行