CSS代码:
#div1{ width: 100px; height: 100px; background: #ccc; position: absolute;}
HTML代码:
<div id="div1"></div>
JS代码:
window.onload = function(){ var oDiv = document.getElementById(‘div1‘); document.onkeydown = function(ev){ var ev = ev || event; switch(ev.keyCode){ //向左移动 case 37: oDiv.style.left = oDiv.offsetLeft - 10 + ‘px‘; break; //向上移动 case 38: oDiv.style.top = oDiv.offsetTop - 10 + ‘px‘; break; //向右移动 case 39: oDiv.style.left = oDiv.offsetLeft + 10 + ‘px‘; break; //向下运动 case 40: oDiv.style.top = oDiv.offsetTop + 10 + ‘px‘; break; } }; };
注意:只有offsetLeft和offsetTop,没有offsetRight和offsetBottom。
说明:event.keyCode值为37﹐38﹐39﹐40对应按下的方向键分別是 左﹐上﹐右﹐下。
时间: 2024-10-07 10:09:30