zoukankan      html  css  js  c++  java
  • Javascript 键盘事件移动图片

    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>
  • 相关阅读:
    boostrapvalidator
    bootstrap 整理
    emil 的使用
    sass笔记
    sql 语句的优化
    多线程笔记
    mysql笔记
    react
    优雅的创建map/list集合
    spring中路径的注入
  • 原文地址:https://www.cnblogs.com/SkySoot/p/2476223.html
Copyright © 2011-2022 走看看