js可拖动的后台界面

　　// ************************ 拖动 *********************************

　　function setDrag(e){

　　var drag_flag = true;

　　var begin_x = getX(e);

　　//添加蒙板

　　createMask();

　　//添加半透明拖动条

　　createSplitDiv();

　　function getX(e){

　　if(window.event) e = window.event;

　　return (e.x || e.clientX);

　　}

　　function createSplitDiv(){

　　//半透明的拖动条

　　var _top = $doc("topArea").offsetHeight +"px";

　　var _left = $doc("dragBar").offsetLeft +"px";;

　　var _height = $doc("dragBar").offsetHeight +"px";;

　　var splitDivCss="position:absolute;width:6px;height:"+_height+";top:"+_top+";left:"+_left+";cursor:col-

　　resize;background-color:#cccccc;overflow:hidden;z-index:10010;filter:alpha(opacity=50);opacity:0.5;";

　　var _splitDiv = document.createElement("div");

　　_splitDiv.id = "splitDiv";

　　_splitDiv.style.cssText = splitDivCss;

　　document.body.appendChild(_splitDiv);

　　}

　　function createMask(){

　　try{

　　//创建背景

　　var rootEl=document.documentElement||document.body;

　　var docHeight=((rootEl.clientHeight>rootEl.scrollHeight)?

　　rootEl.clientHeight:rootEl.scrollHeight)+"px";

　　var docWidth=((rootEl.clientWidth>rootEl.scrollWidth)?rootEl.clientWidth:rootEl.scrollWidth)

　　+"px";

　　var

　　shieldStyle="position:absolute;top:0px;left:0px;width:"+docWidth+";height:"+docHeight+";background:#cccccc;z-

　　index:10000;filter:alpha(opacity=0);opacity:0";

　　var _shield = document.createElement("div");

　　_shield.id = "shield";

　　_shield.style.cssText = shieldStyle;

　　document.body.appendChild(_shield);

　　}catch(e){}

　　}

　　//拖动时执行的函数

　　document.onmousemove = function(e){

　　try{

　　if(drag_flag){

　　var now_x = getX(e);

　　var _pv = parseInt($doc("splitDiv").style.left)+ now_x - begin_x;

　　$doc("splitDiv").style.left = _pv +"px";

　　begin_x = now_x;

　　}else{

　　$doc("leftShow").style.width = $doc("splitDiv").style.left;

　　document.body.removeChild($doc("shield"));

　　document.body.removeChild($doc("splitDiv"));

　　// 调整页面布局

　　resizePage();

　　}

　　}catch(e){}

　　}

　　document.onmouseup = function(){

　　try{

　　if(drag_flag){

　　//设定拖动条的位置（设定左侧的宽度）

　　$doc("leftShow").style.width = $doc("splitDiv").style.left;

　　document.body.removeChild($doc("shield"));

　　document.body.removeChild($doc("splitDiv"));

　　// 调整页面布局

　　resizePage();

　　}

　　drag_flag = false;

　　begin_x = null;

　　}catch(e){}

　　}

　　}

　　if(window.attachEvent){

　　window.attachEvent("onload",function(){resizePage();});

　　window.attachEvent("onresize",function(){resizePage();});

　　}

　　if(window.addEventListener){

　　window.addEventListener("load",function(){resizePage();},true);

　　window.addEventListener("resize",function(){resizePage();},true);

　　}