博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
飞翔的小鸟--键盘事件案例
阅读量:4184 次
发布时间:2019-05-26

本文共 1053 字,大约阅读时间需要 3 分钟。

键盘的上下左右键控制小鸟的方向

var rcode=39;var step=10;$(function (){	var off=$("#dbird").offset(); //方位对象	var dheight=$(window).height;//获得窗体高度	var dwidth=$(window).width;  			var bheight=$(window).height;//图片高度	var bheight=$(window).width;	$(document).keydown(function (e){		var keyCode=e.keyCode;		if(keyCode!=rcode){			$("#dbird").removeClass().addClass("direction-"+keyCode);		}		rcode=keyCode;		switch(keyCode){			case 37://左边			off.left-=step;			if(off.left<=-bwidth){				off.left=dwidth;			}			break;			case 38://上			off.top-=step;			if(off.top<=-bheight){				off.top=dheight;			}			break			case 39://右			off.left+=step;			if(off.left>=dwidth){				off.left=-bwidth;			}			break;			case 40://下			off.top+=step;			if(off.top>=dheight){				off.top=-bheight;			}			break;		}	$("#dbird").offset(off);	})})
css 设置浏览器自适应

#dbird{	width:206px;	height:121px;	positioin:absolute;}body{	overflow:hidden;}.direction-37{	transform:rotateY(180deg);  //旋转沿着Y转180度}.direction-38{	transform:rotateY(-60deg);  //旋转沿着Y转180度}.direction-40{	transform:rotateY(60deg);  //旋转沿着Y转180度}

转载地址:http://zaboi.baihongyu.com/

你可能感兴趣的文章
kafka 消息服务
查看>>
从零开始玩转JMX(一)——简介和Standard MBean
查看>>
究竟啥才是互联网架构中的高并发!
查看>>
数据库水平扩展与垂直扩展
查看>>
Jsp中include动作指令简介
查看>>
交互两个数(不引入第三个变量)
查看>>
C/C++面试题分享
查看>>
链表类型题目需要用到的头文件list.h
查看>>
tree类型题目需要用到的头文件tree.h
查看>>
有一个1亿结点的树,已知两个结点, 求它们的最低公共祖先!
查看>>
BST(binary search tree)类型题目需要用到的头文件binary_tree.h
查看>>
将BST转换为有序的双向链表!
查看>>
中体骏彩C++面试题
查看>>
永成科技C++笔试题
查看>>
webkit入门准备
查看>>
在Ubuntu 12.04 64bit上配置,安装和运行go程序
查看>>
ATS程序功能和使用方法详解
查看>>
常用Linux命令总结
查看>>
Tafficserver旁路接入方案综述
查看>>
在CentOS 6.3 64bit上如何从源码生成rpm包?
查看>>