应无所住,而生其心
排名
1
文章
872
粉丝
112
评论
163
net core webapi post传递参数
庸人 : 确实坑哈,我也是下班好了好几次,发现后台传递对象是可以的,但...
百度编辑器自定义模板
庸人 : 我建议换个编辑器,因为现在百度富文本已经停止维护了,用tinymec...
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术

js键盘移动div与背景滚动效果

6472人阅读 2019/8/30 11:13 总访问:5416228 评论:0 收藏:0 手机
分类: Js相关

通过键盘按下事件记录按键

如果按下的时候就去移动div位置,就不能使用组合键了,不能让div斜着走了,所以只做一个按键记录就好了

  1. //存储按键
  2. var keycodes = {};
  3. $(document).keydown(function (event{
  4.     keycodes[event.keyCode] = true;
  5. });
  6. $(document).keyup(function (event{
  7.     keycodes[event.keyCode] = false;
  8. });

然后使用一个setInterval刷新位置即可

  1. //刷新地图
  2. setInterval(function ({
  3.     var top = parseInt($("#div1").css("top"));
  4.     var left = parseInt($("#div1").css("left"));
  5.     if (keycodes[87]) {
  6.         $("#div1").css("top", top - 15);
  7.     }
  8.     if (keycodes[65]) {
  9.         $("#div1").css("left", left - 15);
  10.     }
  11.     if (keycodes[68]) {
  12.         $("#div1").css("left", left + 15);
  13.     }
  14.     if (keycodes[83] == true) {
  15.         $("#div1").css("top", top + 15);
  16.     }
  17.     if (keycodes[75] == true) {
  18.     }
  19. }, 50);

背景滚动效果:

  1. //地图滚动
  2. var py = 0;
  3. var gamerun = function ({
  4.     py = py + 2;
  5.     $("#gamemap").animate({ "background-position-y": py }, 50,"linear"function ({
  6.       gamerun();//递归
  7.     });
  8. }




欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)

评价

js与Controller中分割字符串的方法

js: varstr=OpenRule; varstrs=newArray(); strs=str.split(","); for(vari=0;i<strs.length;i++){ $(&q...

珍藏!! js CSS不传之秘集合

<!--其中5指每隔5秒刷新一次页面--> <metahttp-equiv="refresh"content="5"> =========...

jsON对象和jsON字符串的区别

JSON对象是直接可以使用JQuery操作的格式,如C#中可以用对象(类名)点出属性(方法)一样var str2 = { "name": ...

对象转jsON

/// <summary> /// 对象转json /// </summary> public static string ToJson(object jsonObject) ...

来!!!今天玩 json

别怪我懒,其实我是真的懒///<summary> ///List转成json ///</summary> ///<typeparamname="T&quot...

js遍历localStorage的键值对

//遍历本地存储localStorage for(vari=0;i<localStorage.length;i++){ varkey=localStorage.key(i);//获取本地存储的K...

拓展js通用方法来对应c操作

有很多时候,js不能像c#一样有那样多的方法操作,但是我们可以自己写一些方法,让他拥有:比如最常见的一些:注意:js里的...

js的localStorage

localStorage的优势1、localStorage拓展了cookie的4K限制2、localStorage会可以将第一次请求的数据直接存储到本地,这个相...

js监听input、keydown,有输入法时打字完成后触发事件

在给输入框绑定input或keydown事件时预期效果是有输入法时,输入中文后触发事件,不希望输一个字母就触发一次事件可以用到c...

js截取两个字符中间的字符串

使用正则表达式来取比如我们要取brush:js;toolbar:false 这个字符串冒号和分号中间的字符串可以varclassname="brush:j...

Vue.js+Layer实现表格数据绑定与更新

一:使用Vue.js绑定好数据与更新事件 使用v-on绑定好事件,在事件里边直接把该行数据传递进去,在更新方法里边就可以直接...

js使用正则进行常用验证

?:问号前面的数字匹配0次或1次,也就是懒惰匹配,最多匹配一次+:匹配1次到无穷次*:匹配0次到无穷次验证只能:数字、字母...

js字符串的替换

vartitle="我是你的大表哥"; title=title.replace("大表哥","大表妹"); alert(title);输...

Vue.js 实现省市联动

HTML代码<divid="pro_citys"> 省:<selectid="provice"v-on:change="prochange()&quo...

Vue.js常见问题

一:花括号当做字符串显示的问题1:检查下绑定到vue.js的id是否重复,如果id重复了,就有可能存在这种问题,因为有可能把数...

vue.js常用指令

v-html可以把字符串当成一个html来渲染,而不是原样输出Html类似.net mvc中的@Html.Raw()方法<divv-html="item.tit...