频道栏目
首页 > 程序开发 > web前端 > HTML/CSS > 正文
打地鼠小游戏设计代码
2017-10-12 09:22:00      个评论    来源:代码小菜鸟  
收藏   我要投稿

打地鼠小游戏设计代码

        var img;
        var imgs;

        window.onload = function(){
// 游戏开始 
document.getElementById(“btn”).onclick = function(){ 
//获取所有图像的数组 
imgs = document.images; 
show(); 
} 
document.getElementById(“yc”).onclick = function(){ 
img.src = “img/00.jpg”; 
} 
}

// 地鼠出现方法 
function show(){ 
// 随机获取一张图片的下标 
var i = parseInt(Math.random()*imgs.length); 
//地鼠随机出现 
img = imgs[i]; 
img.src = “img/01.jpg”;
           setTimeout("show()",1000);
        }
        //打击地鼠方法
        function play(obj){
            //获取图片名称
            var str = obj.src;
            var s = str.split("/");
            var name = s[s.length-1].charAt(1);

            if(name==1){
                obj.src = "img/02.jpg";
            }
        }
    </script>
</head>
<body>
    <button id="btn">开始</button>
    <button id="yc">隐藏</button>

    <!--游戏区域-->
    <table border="1px">
        <tr>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
        </tr>
        <tr>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
        </tr>
        <tr>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
        </tr>
        <tr>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
        </tr>
        <tr>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
            <td><img src="img/00.jpg" onclick="play(this)"/></td>
        </tr>
    </table>
    <span id="str"></span>
</body>
实现了地鼠随机的出现,还有鼠标点击地鼠时出现打击地鼠的效果实现
点击复制链接 与好友分享!回本站首页
上一篇:ServletContext介绍和使用
下一篇:在Ubuntu16.04系统下配置Apache HTTP Server的教程
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站