Javascript 键盘事件移动图片
2019-04-15 18:59发布
生成海报
CODE:
<body onkeydown="movePic()"
>
<div style="
width:
600px;height:
300px;border:1px solid green"
>
<img id="pic" src="lang
.gif"
style="
border:0;
width:
80px;position:
absolute;left:
260;top:120"
>
</
div>
<script>
var pic = document
.getElementById("pic");
var step
= 10;
var x
= pic.style.pixelLeft;
var y
= pic.style.pixelTop;
function movePic(){
var code = event.keyCode;
switch(
code) {
case 37:
x-
=step;
pic
.style.left = x;
break;
case 38:
y-
=step;
pic
.style.top = y;
break;
case 39:
x+
=step;
pic
.style.left = x;
break;
case 40:
y+
=step;
pic
.style.top = y;
break;
}
}
</
script>
</
body>
打开微信“扫一扫”,打开网页后点击屏幕右上角分享按钮