网站建设服务外包,如何做ppt的模板下载网站,网站每年的维护费,网站首页分辨率推箱子小游戏原理的实现
功能分析#xff1a; 1.找一张类似于箱子的图片自行设置图片的大小 2.设置控制箱子移动的四个方向的按钮 3.使用键盘控制图片上下左右的移动、
效果图演示
原始位置 点击键盘向右移动三次向下移动一次后的位置 看了上述过程是不是感觉很有意思呀 1.找一张类似于箱子的图片自行设置图片的大小 2.设置控制箱子移动的四个方向的按钮 3.使用键盘控制图片上下左右的移动、
效果图演示
原始位置 点击键盘向右移动三次向下移动一次后的位置 看了上述过程是不是感觉很有意思呀
下面看代码
!DOCTYPE html
html
head langenmeta charsetUTF-8title/title
/head
body onkeydownchange()
img src1.PNG idimgShow stylewidth: 80px; height: 80px;position:absolute;left: 0px;top: 0px/
script typetext/javascriptvar img document.getElementById(imgShow)img.left 0;img.top 0;function change(){var keyCode event.keyCode;if(keyCode 37){img.left - 80;}if(keyCode 38){img.top - 80;}if(keyCode 39){img.left 80;}if(keyCode 40){img.top 80;}img.style.left img.left px,img.style.top img.top px;}
/script
/body
/html代码很少也很好理解这里面使用了键值对的方式。
了解更多关注我呦