打地鼠css（原创）

Html

Css


    
        
            -游戏时间：-
             分钟(可输入小数表示秒)
        
        
            -倒计时间：-
            
        
        
            -地鼠出现间隔：-
             秒钟(更改提高难度)
        
        
            -停留时间：-
             秒钟(更改提高难度)
        
        
            -得分情况：-
            
                
            
        
        
            
            
        
    
    (点击结束后选择，参数点击开始可以刷新数据重新开始)

img {
	width:90px;
	height:90px;
}
html,body {
	width:100%;
	height:100%;
	background:url(https://www.jq22.com/img/cs/500x500-3.png);
	background-position:center;
	background-repeat:no-repeat;
	background-size:100% 100%;
}
.d1 {
	width:545px;
	height:240px;
	right:400px;
	top:25px;
	font-weight:bolder;
	position:absolute;
}
.d2 {
	margin:0,auto;
	position:absolute;
	top:220px;
	left:550px;
}

var begin, over, dsjg, tlsj, time, djs; //开始，结束，间隔，停留，时间，倒计时
var imgs, showMouse;
var sc;

//开始游戏
function starGame() {
    document.getElementById("begin").disabled = true;
    document.getElementById("over").disabled = false;

time = window.document.getElementById("time");
    djs = window.document.getElementById("djs");
    dsjg = window.document.getElementById("dsjg");
    tlsj = window.document.getElementById("tlsj");
    sc = window.document.getElementById("sc");
    begin = window.document.getElementById("begin");
    over = window.document.getElementById("over");
    imgs = document.image;
    init();
    djs = window.setInterval("djtime()", 1000);
    show_mouse();

}

function djtime() {
    document.getElementById("djs").innerHTML = time + "秒";
    if (time <= 0) {
        gameover();
    }
    time--;
}
var sindex = -1;

function show_mouse() {
    var index = Math.floor((Math.random() * 25));
    while (sindex == index) {
        index = Math.floor((Math.random() * 25));
    }
    sindex = index;
    document.getElementsByTagName("img")[index].src = "https://www.jq22.com/img/cs/500x500-4.png";
    setTimeout(hide, tlsj * 1000);
    showMouse = window.setTimeout("show_mouse()", dsjg * 1000);
}

function hide() {
    document.getElementsByTagName("img")[sindex].src = "https://www.jq22.com/img/cs/500x500-2.png";
}
//打地鼠
function play(obj) {
    var name = obj.src.substr(obj.src.length - 5, 1);
    if (name == 1) {
        obj.src = "https://www.jq22.com/img/cs/500x500-5.png";
        sc += 2;
        document.getElementById("sc").innerHTML = sc + "分";
        //打中后还原
        window.setTimeout(function() {
            obj.src = "https://www.jq22.com/img/cs/500x500-2.png";
        }, 1000);

}
}
//初始化数据
function init() {
    time = document.getElementById("time").value * 60;
    dsjg = document.getElementById("dsjg").value;
    tlsj = document.getElementById("tlsj").value;
    sc = 0;
}

function huanyuan() {
    for (var i = 0; i < imgs.length; i++) {
        imgs[i].src = "https://www.jq22.com/img/cs/500x500-2.png";
    }
}
//停止游戏
function gameover() {
    clearTimeout(time);
    clearTimeout(tlsj);
    clearTimeout(djs);
    clearTimeout(showMouse);
    document.getElementById("begin").disabled = false;
    document.getElementById("over").disabled = true;
    huanyuan();

}

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

打地鼠css（原创）

代码描述：实现打地鼠，可以自己调节难度，记录分数

更新时间：2022-11-22 13:20:34
<p cid="n0" mdtype="paragraph" > 可以调节游戏时间，选择玩多久时间，通过更改地鼠出现时间间隔以及停留时间直接更改游戏难度。 https://www.jq22.com/img/cs/500x500-1.png-->绿草地背景 https://www.jq22.com/img/cs/500x500-2.png-->地鼠洞 https://www.jq22.com/img/cs/500x500-3.png-->提示文字背景图 https://www.jq22.com/img/cs/500x500-4.png-->地鼠出洞图 https://www.jq22.com/img/cs/500x500-5.png-->地鼠被打图

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

10110h

相关代码

打地鼠css（原创）

最新

-游戏时间：-	分钟(可输入小数表示秒)
-倒计时间：-
-地鼠出现间隔：-	秒钟(更改提高难度)
-停留时间：-	秒钟(更改提高难度)
-得分情况：-