键盘控制div上下左右移动 (转)

简介: $(function(){ $(document).keydown(function (event) { var keyCode = event.keyCode; var space = 20; var div = $('#div'); switch(keyCode){ case 37: div.
<html> <head> <title></title> <link rel="stylesheet" type="text/css" href="public/easy_ui/themes/icon.css"> <script type="text/javascript" src="public/easy_ui/jquery.min.js"></script> <script type="text/javascript" src="public/easy_ui/easy_ui.min.js"></script> <script type="text/javascript" src="public/easy_ui/easyloader.js"></script> </head> <body> <div id="div" style="background-color: red; width: 400px; height: 300px; left: 100px; top: 100px;"> </div> </body> <script> $(function(){ $(document).keydown(function (event) { var keyCode = event.keyCode; var space = 20; var div = $('#div'); switch(keyCode){ case 37: div.offset({left:(div.offset().left - 20)}); break; case 38: div.offset({top:(div.offset().top - 20)}); break; case 39: div.offset({left:(div.offset().left + 20)}); break; case 40: div.offset({top:(div.offset().top + 20)}); break; default: break; } }); }); </script> </html> http://www.cnblogs.com/cglWorkBook/p/5134698.html  
相关文章
|
API 数据库 数据安全/隐私保护
利用Django框架构建高效后端API服务
本文将介绍如何利用Django框架构建高效的后端API服务。通过深入分析Django框架的特性和优势,结合实际案例,探讨了如何利用Django提供的强大功能来构建高性能、可扩展的后端服务。同时,还对Django框架在后端开发中的一些常见问题进行了解决方案的探讨,并提出了一些建设性的建议。
408 3
|
算法 安全
【操作系统】死锁处理-银行家算法
【操作系统】死锁处理-银行家算法
539 0
|
机器学习/深度学习 算法 计算机视觉
基于多注意力融合的抗遮挡目标跟踪算法综述
基于多注意力融合的抗遮挡目标跟踪算法综述
904 0
基于多注意力融合的抗遮挡目标跟踪算法综述
|
前端开发 JavaScript
ajax Fileupload多文件上传实现案例
ajax Fileupload多文件上传实现案例
326 1
阿里云COM域名续费优惠口令“商标优选即买即用”
2023阿里云COM域名续费优惠口令“商标优选即买即用”,阿里云COM域名注册或续费均可使用优惠口令,如果是新用户还可以领取com域名注册代金券,企业新用户注册com域名优惠价1元首年,个人新用户注册com域名首年33元一年,新手站长分享阿里云com域名注册价格、续费价格、注册优惠口令、续费优惠口令和注册代金券领取:
600 0
阿里云COM域名续费优惠口令“商标优选即买即用”
Intellij IDEA 鼠标放到类,方法,变量上 显示相关信息
Intellij IDEA 鼠标放到类,方法,变量上 显示相关信息
Intellij IDEA 鼠标放到类,方法,变量上 显示相关信息
|
架构师 程序员
互联网大厂程序员岗位职级划分
相信只要是程序员,都有做过对进入大厂的梦。但也有好多小伙伴们,对大厂只了解一些外在的,不是那么了解。所以今天总结一下10家互联网大厂程序员岗位职级划分,让大家更加认清大厂职级,努力晋升,程序员翻身把家当!不要忘记点赞收藏哦~
11710 23
|
存储 Ubuntu Linux
ZYNQ - 嵌入式Linux开发 -02- 用户权限管理和磁盘管理
ZYNQ - 嵌入式Linux开发 -02- 用户权限管理和磁盘管理
476 0
ZYNQ - 嵌入式Linux开发 -02- 用户权限管理和磁盘管理
|
数据安全/隐私保护 iOS开发 开发者
Mac解决安装软件文件损坏问题
Mac解决安装软件文件损坏问题
|
资源调度 前端开发 程序员
大前端快闪二:react开发模式 一键启动多个服务
最近全权负责了一个前后端分离的web项目,前端使用create-react-app[1], 后端使用golang做的api服务。
大前端快闪二:react开发模式 一键启动多个服务