日期:2014-05-16 浏览次数:20372 次
//css样式 .over_layer{ background-color: black; display: none; height: 100%; left: 0; opacity: 0.5; position: absolute; top: 0; width: 100%; z-index: 1001; } //遮蔽层 <div id="fade" class="over_layer" style="background:black; filter: alpha(opacity=50); opacity: 0.5; -moz-opacity:0.5;"></div> //js function getScrollTop(){ var scrollTop = 0; if(document.documentElement && document.documentElement.scrollTop){ scrollTop = document.documentElement.scrollTop; }else if(document.body){ scrollTop = document.body.scrollTop; } return scrollTop; } var wcontentflag = false,wcontentX=null,wcontentY=null,offsetWidth=null,offsetHeigth=null,isaddoffset=false; function showModel(showId,isdrop){ $("#fade").css("height",window.screen.availHeight+parseFloat(getScrollTop())); $("#fade").css("width",window.screen.availWidth); try{ $("#"+showId).css("z-index",1005); $("#"+showId).css("position","absolute"); $("#"+showId).css("top",20+parseFloat(getScrollTop())); $("#"+showId).css("left",window.screen.availWidth/2-parseFloat($("#"+showId).css("width"))/2); }catch(e){} if(typeof(isdrop)=='undefined' || isdrop == true){ $("#"+showId).bind("mousedown",function(e){ if(!wcontentflag){ wcontentflag = true; wcontentX = e.pageX; wcontentY = e.pageY; offsetWidth = e.pageX - parseFloat($(this).css("left")); offsetHeight = e.pageY - parseFloat($(this).css("top")); $(this).css("cursor","pointer"); } }); $("body").bind("mousemove",function(e){ if(wcontentflag){ var nowPageX = e.pageX; var nowPageY = e.pageY; var nowObjX = parseFloat($("#"+showId).css("left")); var nowObjY = parseFloat($("#"+showId).css("top")); nowObjX = parseFloat(nowObjX) + (nowPageX-nowObjX); nowObjY = parseFloat(nowObjY) + (nowPageY-nowObjY); nowObjX -= offsetWidth; nowObjY -= offsetHeight; $("#"+showId).css({left:nowObjX,top:nowObjY}); $("#"+showId).css({left:nowObjX,top:nowObjY}); } }); $("body").bind("mouseup",function(e){ if(wcontentflag){ wcontentflag = false; isaddoffset =false; $("#"+showId).css("cursor","default"); } }); } showAndHidden(showId,'show'); showAndHidden('fade','show'); }