Box = document.getElementById("
Box");
var bLeft = bTop = bRight = bBottom = bCtrlKey = false;
@H_
502_0@setInterval(function ()
{
if (bLeft)
{
o
Box.style.left = o
Box.offsetLeft - 10 + "px"
}
else if (bRight)
{
o
Box.style.left = o
Box.offsetLeft + 10 + "px"
}
@H_
502_0@if (bTop)
{
o
Box.style.top = o
Box.offsetTop - 10 + "px"
}
else if(bBottom)
{
o
Box.style.top = o
Box.offsetTop + 10 + "px"
}
//防止溢出
limit();
},30);
@H_
502_0@document.onkeydown = function (event)
{
var event = event || window.event;
bCtrlKey = event.ctrlKey;
@H_
502_0@switch (event.keyCode)
{
case 37:
bLeft = true;
break;
case 38:
if(bCtrlKey)
{
var oldWidth = o
Box.offsetWidth;
var oldHeight = o
Box.offsetHeight;
@H_
502_0@o
Box.style.width = o
Box.offsetWidth * 1.5 + "px";
o
Box.style.height = o
Box.offsetHeight * 1.5 + "px";
@H_
502_0@o
Box.style.left = o
Box.offsetLeft - (o
Box.offsetWidth - oldWidth) / 2 + "px";
o
Box.style.top = o
Box.offsetTop - (o
Box.offsetHeight - oldHeight) / 2 + "px";
@H_
502_0@break;
}
bTop = true;
break;
case 39:
bRight = true;
break;
case 40:
if(bCtrlKey)
{
var oldWidth = o
Box.offsetWidth;
var oldHeight = o
Box.offsetHeight;
@H_
502_0@o
Box.style.width = o
Box.offsetWidth * 0.75 + "px";
o
Box.style.height = o
Box.offsetHeight * 0.75 + "px";
@H_
502_0@o
Box.style.left = o
Box.offsetLeft - (o
Box.offsetWidth - oldWidth) / 2 + "px";
o
Box.style.top = o
Box.offsetTop - (o
Box.offsetHeight - oldHeight) / 2 + "px";
@H_
502_0@break;
}
bBottom = true;
break;
case 49:
bCtrlKey && (o
Box.style.background = "green");
break;
case 50:
bCtrlKey && (o
Box.style.background = "yellow");
break;
case 51:
bCtrlKey && (o
Box.style.background = "blue");
break;
}
@H_
502_0@return false
};
@H_
502_0@document.onkeyup = function (event)
{
switch ((event || window.event).keyCode)
{
case 37:
bLeft = false;
break;
case 38:
bTop = false;
break;
case 39:
bRight = false;
break;
case 40:
bBottom = false;
break;
}
};
@H_
502_0@//防止溢出
function limit()
{
var doc = [document.documentElement.clientWidth,document.documentElement.clientHeight]
//防止左侧溢出
o
Box.offsetLeft <=0 && (o
Box.style.left = 0);
//防止顶部溢出
o
Box.offsetTop <=0 && (o
Box.style.top = 0);
//防止右侧溢出
doc[0] - o
Box.offsetLeft - o
Box.offsetWidth <= 0 && (o
Box.style.left = doc[0] - o
Box.offsetWidth + "px");
//防止
底部溢出
doc[1] - o
Box.offsetTop - o
Box.offsetHeight <= 0 && (o
Box.style.top = doc[1] - o
Box.offsetHeight + "px")
}
};
_0@上：↑ 下：↓ 左：← 右：→
Ctrl + 1 : 背景变为绿色
Ctrl + 2 : 背景变为黄色
Ctrl + 3 : 背景变为蓝色
Ctrl + ↑ : 放大
Ctrl + ↓ : 缩小
@H_
