控制个div上下左右移动 ie下<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档 </title> <script type="text/javascript"> var flagx=1; var flagy=1; var wwidth=document.documentElement.clientWidth; var wheight=document.documentElement.clientHeight ; function keyDown() {
var keycode = event.keyCode var realkey = String.fromCharCode(event.keyCode) // alert("keycode: " + keycode + " realkey: " + realkey) if(document.getElementById('div1').style.position!="absolute") { document.getElementById('div1').style.position="absolute"; } switch(keycode) { case 37 : if(flagx>0){document.getElementById("div1").style.left=flagx--}else{flagx=1};break; case 38 : if(flagy>0){document.getElementById("div1").style.top=flagy--}else{flagy=1};break; case 39 : if(flagx<wwidth){document.getElementById("div1").style.left=flagx++}else{flagx=wwidth};break; case 40 : if(flagy<wheight){document.getElementById("div1").style.top=flagy++}else{flagy=wheight};break; } } document.onkeydown = keyDown </script> </head> <body> <form id="form1" style=""> <div id="div1" style='width:200px;height:200px;background-color:red;'></div> </form> </body> </html>
选中某个图片上下左右移动?
event.keyCode值為37﹐38﹐39﹐40對應按下的方向鍵分別是 左﹐上﹐右﹐下
if( 37 == event.keyCode )
{
moveLeft();
}
else if(38)
...控制元素移动的代码..
网上找大把..我一般也是也的时候google
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档 </title>
<script type="text/javascript">
var flagx=1;
var flagy=1;
var wwidth=document.documentElement.clientWidth;
var wheight=document.documentElement.clientHeight ;
function keyDown() {
var keycode = event.keyCode
var realkey = String.fromCharCode(event.keyCode)
// alert("keycode: " + keycode + " realkey: " + realkey)
if(document.getElementById('div1').style.position!="absolute")
{
document.getElementById('div1').style.position="absolute";
}
switch(keycode)
{
case 37 : if(flagx>0){document.getElementById("div1").style.left=flagx--}else{flagx=1};break;
case 38 : if(flagy>0){document.getElementById("div1").style.top=flagy--}else{flagy=1};break;
case 39 : if(flagx<wwidth){document.getElementById("div1").style.left=flagx++}else{flagx=wwidth};break;
case 40 : if(flagy<wheight){document.getElementById("div1").style.top=flagy++}else{flagy=wheight};break;
}
}
document.onkeydown = keyDown </script>
</head>
<body>
<form id="form1" style="">
<div id="div1" style='width:200px;height:200px;background-color:red;'></div>
</form>
</body>
</html>
然后给Panel加个onkeypress事件.
获取event.keyCode 如果为37﹐38﹐39﹐40 根据点击不同的方向键
来触发不同的事件.