<html>

    <head>

    <!-- 不做了，思路：

        按enter键停止，将xs，ys替换为0，再次按，判断xs和ys是否为0，是的话，讲根据fx给xsys赋值。

        实现鼠标点哪往哪里走：获取鼠标的坐标，和现在的左边，确定应该往x走多少，y走多少，根据x y的值调走的速度

    -->

    </head>

    <body onkeydown="opt()">

        <img border="0" id="ren" src="data:images/q_1.jpg" style="position:absolute;left:0px;top:0px;">

    </body>

    <script>

        var ren=document.getElementById("ren");

        var fx="q";

        function transStr(obj){

            //return obj.substring(obj.lastIndexOf("/")+1,obj.length);

            return obj.substr(obj.lastIndexOf("/")+1);

        }

        function changetu(){

            if(transStr(ren.src).charAt(2)=="1")

                ren.src="data:images/"+fx+"_2.jpg";

            else

                ren.src="data:images/"+fx+"_1.jpg";

        }

        function start1(){

            setInterval(function(){

                run();

                changetu();

            },400);

        }

        start1();

        function opt(){

            var code=event.keyCode;

            switch(code){

            case 37://左

                fx="z"

                ys=0;

                xs=-5;

                break;

            case 39://右

                fx="y";

                ys=0;

                xs=5;

                break;

            case 38://上

                fx="h";

                xs=0;

                ys=-5;

                break;

            case 40://下

                fx="q";

                xs=0;

                ys=5;

                break;

            }

        }

        var x=0;

        var y=0;

        var xs=0;

        var ys=0;

        function run(){

            x+=xs;

            y+=ys

            ren.style.left=x;

            ren.style.top=y;

        }

    </script>

</html>

07_js走路小游戏的更多相关文章

  1. jQuery实践-网页版2048小游戏

    ▓▓▓▓▓▓ 大致介绍 看了一个实现网页版2048小游戏的视频,觉得能做出自己以前喜欢玩的小游戏很有意思便自己动手试了试,真正的验证了这句话-不要以为你以为的就是你以为的,看视频时觉得看懂了,会写了, ...

  2. 拼图小游戏之计算后样式与CSS动画的冲突

    先说结论: 前几天写了几个非常简单的移动端小游戏,其中一个拼图游戏让我郁闷了一段时间.因为要获取每张图片的位置,用`<style>`标签写的样式,直接获取计算后样式再用来交换位置,结果就悲 ...

  3. 推荐10款超级有趣的HTML5小游戏

    HTML5的发展速度比任何人的都想像都要更快.更加强大有效的和专业的解决方案已经被开发......甚至在游戏世界中!这里跟大家分享有10款超级趣味的HTML5游戏,希望大家能够喜欢! Kern Typ ...

  4. 如何开发一个简单的HTML5 Canvas 小游戏

    原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...

  5. JavaScript版拼图小游戏

    慕课网上准备开个新的jQuery教程,花了3天空闲时间写了一个Javascript版的拼图小游戏,作为新教程配套的分析案例 拼图游戏网上有不少的实现案例了,但是此源码是我自己的实现,所以不做太多的比较 ...

  6. C语言-纸牌计算24点小游戏

    C语言实现纸牌计算24点小游戏 利用系统时间设定随机种子生成4个随机数,并对4个数字之间的运算次序以及运算符号进行枚举,从而计算判断是否能得出24,以达到程序目的.程序主要功能已完成,目前还有部分细节 ...

  7. Cocos2d-x 版本小游戏 《是男人就下100层》 项目开源

    这个是很久就开始动手写的一个小游戏了,直到最近才把它收尾了,拖拖拉拉的毛病总是很难改啊. 项目是基于 cocos2d-x v2.2 版本 ,目前只编译到了 Win8 平台上,并且已经上传到了商店,支持 ...

  8. Chrome 中的彩蛋，一款小游戏，你知道吗？

    今天看到一篇文章,介绍chrome中的彩蛋,带着好奇心进去看了一眼,没想到发现了一款小游戏,个人觉得还不错,偶尔可以玩一下,放松放松心情!^_^ 当 Chrome 无法连接到互联网时, 或者上着网突然 ...

  9. 软件工程：黄金G点小游戏1.0

    我们要做的是黄金G点小游戏: N个同学(N通常大于10),每人写一个0~100之间的有理数 (不包括0或100),交给裁判,裁判算出所有数字的平均值,然后乘以0.618(所谓黄金分割常数),得到G值. ...

随机推荐

  1. 如何用 Parse 和 Swift 搭建一个像 Instagram 那样的应用？（3）

    [编者按]本篇文章作者是 Reinder de Vries,既是一名企业家,也是优秀的程序员,发表多篇应用程序的博客.本篇文章中,作者主要介绍了如何基于 Parse 特点,打造一款类似 Instagr ...

  2. POJ 2480 Longge's problem （积性函数，欧拉函数）

    题意:求∑gcd(i,n),1<=i<=n思路:f(n)=∑gcd(i,n),1<=i<=n可以知道,其实f(n)=sum(p*φ(n/p)),其中p是n的因子.为什么呢?原因 ...

  3. POJ 3696 The Luckiest number （欧拉函数，好题）

    该题没思路,参考了网上各种题解.... 注意到凡是那种11111..... 22222..... 33333.....之类的序列都可用这个式子来表示:k*(10^x-1)/9进而简化:8 * (10^ ...

  4. ***PHP preg_match正则表达式的使用

    第一,让我们看看两个特别的字符:‘^’和‘$’他们是分别用来匹配字符串的开始和结束,以下分别举例说明 : "^The": 匹配以 "The"开头的字符串; &q ...

  5. 2014多校第七场1005 || HDU 4939 Stupid Tower Defense （DP）

    题目链接 题意 :长度n单位,从头走到尾,经过每个单位长度需要花费t秒,有三种塔: 红塔 :经过该塔所在单位时,每秒会受到x点伤害. 绿塔 : 经过该塔所在单位之后的每个单位长度时每秒都会经受y点伤害 ...

  6. （转）android屏幕适配

    声明:eoe文章著作权属于作者,受法律保护,转载时请务必以超链接形式附带如下信息 原文作者: zhuangyujia 原文地址: http://my.eoe.cn/zhuangyujia/archiv ...

  7. hadoop 1 testcase运行方法

       转入hadoop2.0后,逐渐忘记了之前做testcase运行的方法,记录一下:    ant -Dtestcase=Test***    如果只运行core包得testcase可以    an ...

  8. 李洪强iOS开发之UICollectionView的使用

    想做如下的界面效果(纯代码) ------------------------------------------------------------------------------------ ...

  9. iOS CoreMotion框架（传感器）

    我们知道iOS的应用真的太多了,很多应用让我们惊叹不已!!!很多意想不到的应用! 比如: 1.电子罗盘指南针之类的应用-让我们知道方向. 2.运动类型软件-让我们知道我们跑步多少公里. 3.社交软件中 ...

  10. jQuery-瀑布流-绝对定位布局（二）(延迟AJAX加载图片)

    jQuery-瀑布流-绝对定位布局(二)(延迟AJAX加载图片)   瀑布流-绝对定位布局,与浮动布局的区别在于 1.布局不一样: 绝对定位:一个UL里面放置所有的绝对定位的LI: 浮动布局:多个(一 ...