锘??xml version="1.0" encoding="utf-8" standalone="yes"?>
var saveLeft,saveTop,saveWidth,saveHeight;
var theBody;
var eventType; //浜嬩歡縐嶇被, "move"銆?resize"
var div;
//鍒涘緩騫惰瀹歞iv鐨勫弬鏁?
function setDiv(content)
{
//闃叉閲嶅鎵撳紑
if (div)
{
eCloseDiv();
}
var newLeft,newTop,newWidth,newHeight;
theBody = document.body;
div = document.createElement("div");
div.id = "panelDiv";
div.style.position = "absolute";
div.style.backgroundColor = "#5F86B5" // 杈規(guī)棰滆壊
div.style.padding = "1px 1px 1px 1px";
div.style.overflow = "hidden";
div.style.zIndex = 1;
//璁懼畾鎵撳紑鐨勫ぇ灝忓拰浣嶇疆
Function()
{
//榛樿澶у皬榛樿浣嶇疆灞呬腑鎵撳紑
newWidth = "350px";
newHeight = "260px";
newLeft = (theBody.clientWidth - parseInt(newWidth)) / 2 + "px";
newTop = (theBody.clientHeight - parseInt(newHeight)) / 2 + "px";
div.style.width = newWidth;
div.style.height = newHeight;
div.style.left = newLeft;
div.style.top = newTop;
}
div = setChild(div,content);
theBody.appendChild(div);
// var ipt = document.getElementsByTagName("input");
// for(var i = 0; i < ipt.length; i++)
// {
// ipt[i].disabled = true;
// }
}
function setChild(div,content)
{
//鍙惁縐誨姩銆佽皟鏁?
var isMove = true
var isResize = true;
//搴曡壊
var cDiv = document.createElement;
var backDiv = cDiv("div");
backDiv.style.cssText = "left: 0px; top: 0px; width: 100%; height: 100%; background-color:#DFE8F6;" ;
div.appendChild(backDiv);
//鏍囬
var topDiv = cDiv("div");
topDiv.style.cssText = "left: 1px; top: 1px; width: 100%; height: 22px; border-bottom:1px solid #5F86B5; position: absolute; background: url(images/bgd.gif) repeat-x; vertical-align: middle; z-index: 5";
if (isMove)
{
topDiv.style.cursor = "move";
topDiv.setAttribute("onmousedown", function(){setMove(this)});
}
else
{
topDiv.style.cursor = "default";
}
topDiv.innerHTML = "<span style='top: 5px; left:5px; font-size: 12px; font-weight: bold; color: #102548; position: relative;' onselectstart='return false'>榪囨護鎻愮ず</span>";
div.appendChild(topDiv);
//鍏抽棴鎸夐挳
var closeDiv = cDiv("div");
closeDiv.style.cssText = "right: 8px; top : 4px; width: 16px; height: 16px; position: absolute; text-align: center; vertical-align: middle; cursor: pointer; z-index:10";
closeDiv.setAttribute("onclick", function() {eCloseDiv()});
closeDiv.innerHTML = "<span style='font-size: 12px; font-weight: bold; color: #0E377A;' title='Esc蹇嵎閿?><img src = 'images/close.gif'/></span>";
div.appendChild(closeDiv);
//鍐呭
var contentDiv = cDiv("div");
contentDiv.style.cssText = "left: 1px; top: 35px; background-color:#DFE8F6; width: 100%; position: absolute; overflow: auto; padding:5px;";
contentDiv.style.height = (parseInt(div.style.height) - 40) + "px";
contentDiv.innerHTML = "<table style='width: 100%; height: 100%; text-align: left; vertical-align: hidden'><tr><td><p>"+content+"</p></td></tr></table>";
div.appendChild(contentDiv);
//璋冩暣澶у皬
var reDiv = cDiv("div");
reDiv.style.cssText = "right: 0px; bottom: 0px; width: 5px; height: 5px; position: absolute;";
if (isResize)
{
reDiv.style.cursor = "se-resize";
reDiv.setAttribute("onmousedown", function(){setResize(this)});
}
else
{
reDiv.style.cursor = "default";
}
div.appendChild(reDiv);
return div;
}
var oX, oY, oLeft, oTop, oWidth, oHeight; //瀛樺偍鍘熷縐誨姩鍓嶇殑浣嶇疆
var divClone, oDiv; //鍏嬮殕鐨勮妭鐐瑰拰鍘熷鑺傜偣
var oTime;
//clone鎷栫Щ鐨勮妭鐐?
function setMove(obj)
{
if (event.button == 1)
{
if (oTime)
{
clearTimeout(oTime);
divClone.parentNode.removeChild(divClone);
}
oDiv = obj.parentNode;
divClone = oDiv.cloneNode(true);
divClone.style.filter = "Alpha(opacity=50)";
divClone.childNodes[1].setAttribute("onmousemove", function(){startMove(this)});
divClone.childNodes[1].setAttribute("onmouseup", function(){endMove()});
oX = parseInt(event.clientX);
oY = parseInt(event.clientY);
oLeft = parseInt(divClone.style.left);
oTop = parseInt(divClone.style.top);
document.body.appendChild(divClone);
divClone.childNodes[1].setCapture();
eventType = "move";
}
}
//鎷栫Щ
function startMove(obj)
{
if (eventType == "move" && event.button == 1)
{
var moveDiv = obj.parentNode;
moveDiv.style.left = (oLeft + event.clientX - oX) + "px";
moveDiv.style.top = (oTop + event.clientY - oY) + "px";
}
}
//鎷栫Щ緇撴潫璋冪敤鍔ㄧ敾
function endMove()
{
if (eventType == "move")
{
divClone.childNodes[1].releaseCapture();
move(parseInt(divClone.style.left), parseInt(divClone.style.top));
eventType = "";
}
}
//縐誨姩鐨勫姩鐢?
function move(aimLeft, aimTop)
{
var nowLeft = parseInt(oDiv.style.left);
var nowTop = parseInt(oDiv.style.top);
var moveSize = 30;
if (nowLeft > aimLeft + moveSize || nowLeft < aimLeft - moveSize || nowTop > aimTop + moveSize || nowTop < aimTop - moveSize)
{
oDiv.style.left = aimLeft > nowLeft + moveSize ? (nowLeft + moveSize) + "px" : aimLeft < nowLeft - moveSize ? (nowLeft - moveSize) + "px" : nowLeft + "px";
oDiv.style.top = aimTop > nowTop + moveSize ? (nowTop + moveSize) + "px" : aimTop < nowTop - moveSize ? (nowTop - moveSize) + "px" : nowTop + "px";
oTime = setTimeout("move(" + aimLeft + ", " + aimTop + ")", 1);
}
else
{
oDiv.style.left = divClone.style.left;
oDiv.style.top = divClone.style.top;
divClone.parentNode.removeChild(divClone);
divClone == null;
}
}
//clone璋冩暣澶у皬鐨勮妭鐐?
function setResize(obj)
{
if (event.button == 1)
{
if (oTime)
{
clearTimeout(oTime);
divClone.parentNode.removeChild(divClone);
}
oDiv = obj.parentNode;
divClone = oDiv.cloneNode(true);
divClone.style.filter = "Alpha(opacity=50)";
divClone.childNodes[4].setAttribute("onmousemove", function(){startResize(this)});
divClone.childNodes[4].setAttribute("onmouseup", function(){endResize()});
oX = parseInt(event.clientX);
oY = parseInt(event.clientY);
oWidth = parseInt(divClone.style.width);
oHeight = parseInt(divClone.style.height);
document.body.appendChild(divClone);
divClone.childNodes[4].setCapture();
eventType = "resize";
}
}
//鎷栧姩璋冩暣澶у皬
function startResize(obj)
{
if (eventType == "resize" && event.button == 1)
{
var nX = event.clientX;
var nY = event.clientY;
if (nX > oX - oWidth && nY > oY - oHeight + 40)
{
var resizeDiv = obj.parentNode;
resizeDiv.style.width = (oWidth + event.clientX - oX) + "px";
resizeDiv.style.height = (oHeight + event.clientY - oY) + "px";
resizeDiv.childNodes[3].style.height = (parseInt(resizeDiv.style.height) - 40) + "px";
}
}
}
//璋冩暣澶у皬緇撴潫
function endResize()
{
if (eventType == "resize")
{
divClone.childNodes[4].releaseCapture();
resize(parseInt(divClone.style.width), parseInt(divClone.style.height));
eventType = "";
}
}
//璋冩暣澶у皬鐨勫姩鐢?
function resize(aimWidth, aimHeight)
{
var nowWidth = parseInt(oDiv.style.width);
var nowHeight = parseInt(oDiv.style.height);
var resizeSize = 30;
if (nowWidth > aimWidth + resizeSize || nowWidth < aimWidth - resizeSize || nowHeight > aimHeight + resizeSize || nowHeight < aimHeight - resizeSize)
{
oDiv.style.width = aimWidth > nowWidth + resizeSize ? (nowWidth + resizeSize) + "px" : aimWidth < nowWidth - resizeSize ? (nowWidth - resizeSize) + "px" : nowWidth + "px";
oDiv.style.height = aimHeight > nowHeight + resizeSize ? (nowHeight + resizeSize) + "px" : aimHeight < nowHeight - resizeSize ? (nowHeight - resizeSize) + "px" : nowHeight + "px";
oDiv.childNodes[3].style.height = (parseInt(oDiv.style.height) - 40) + "px";
oTime = setTimeout("resize(" + aimWidth + ", " + aimHeight + ")", 1);
}
else
{
oDiv.style.width = divClone.style.width;
oDiv.style.height = divClone.style.height;
oDiv.childNodes[3].style.height = (parseInt(oDiv.style.height) - 40) + "px";
divClone.parentNode.removeChild(divClone);
divClone == null;
}
}
//鍏抽棴DIV
function eCloseDiv()
{
if (div)
{
div.parentNode.removeChild(div);
// var ipt = document.getElementsByTagName("input");
// for(var i = 0; i < ipt.length; i++)
// {
// ipt[i].disabled = false;
// }
div = null;
}
}
//淇濈暀浣嶇疆鍜屽ぇ灝?
function saveDiv()
{
if (div)
{
saveLeft = div.style.left;
saveTop = div.style.top;
saveWidth = div.style.width;
saveHeight = div.style.height;
}
}
//蹇嵎閿?
document.onkeydown = function()
{
event.keyCode == 27 ? eCloseDiv() : null; //Esc蹇嵎閿?
event.ctrlKey && (event.keyCode == 83 || event.keyCode == 115) ? saveDiv() : null; //ctrl+s淇濆瓨浣嶇疆
event.ctrlKey && event.keyCode == 13 ? setDiv() : null //ctrl+enter鎵撳紑Div
!event.ctrlKey && (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) ? arrowMove(event.keyCode) : null;
event.ctrlKey && (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) ? arrowResize(event.keyCode) : null;
}
// 鍗曞嚮灞備互澶栫殑鍦版柟闅愯棌灞?br />
document.onclick = function()
{
if (div)
{
if(typeof event.srcElement.message == "undefined")
{
if (div.componentFromPoint(event.clientX,event.clientY)=="outside")
{
eCloseDiv();
}
}
}
}
//涓婁笅宸﹀彸綆ご縐誨姩div
function arrowMove(eKeyCode)
{
if (div)
{
var isMove = document.getElementById("isMove").checked;
if (isMove)
{
switch(eKeyCode)
{
case 37:
div.style.left = (parseInt(div.style.left) - 1) + "px"; //left
break
case 38:
div.style.top = (parseInt(div.style.top) - 1) + "px"; //up
break
case 39:
div.style.left = (parseInt(div.style.left) + 1) + "px"; //right
break
case 40:
div.style.top = (parseInt(div.style.top) + 1) + "px"; //down
break
}
}
}
}
//ctrl+涓婁笅宸﹀彸綆ご璋冩暣div澶у皬
function arrowResize(eKeyCode)
{
if (div)
{
var isResize = document.getElementById("isResize").checked;
if (isResize)
{
switch(eKeyCode)
{
case 37:
div.style.width = (parseInt(div.style.width) - 1) + "px"; //left
break
case 38:
div.style.height = (parseInt(div.style.height) - 1) + "px"; //up
break
case 39:
div.style.width = (parseInt(div.style.width) + 1) + "px"; //right
break
case 40:
div.style.height = (parseInt(div.style.height) + 1) + "px"; //down
break
}
}
}
}