mmpg游戏

PROMULGATOR

我是啊杰阿

江西省吉安市

← 原生js时钟代码

→ js小球碰撞动画

相关代码

jQuery虚拟键盘

利用jquery制作回车触发事件

jQuery键盘控制图片滑动轮播

触发事件返回顶部

控制焦点选择模块

上下左右四个键盘事件实现元素的选择

Html

Css

Js

剩余血量:目前得分:0

* {
	margin:0;
	padding:0;
}
div {
	width:60px;
	line-height:60px;
	text-align:center;
	border:1px solid #000;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
}
p {
	text-align:right;
}
.bag {
	width:600px;
	height:600px;
	border:1px solid #000;
	position:absolute;
	top:300px;
	left:1200px;
	background:#fff;
	z-index:0;
}

var div = $("<div>角色</div>");
$("body").append(div);
var maxX = innerWidth / 60 - 1;
var maxY = parseInt(innerHeight / 60) - 1;
var user = parseInt(prompt("请输入难度：\n1、简单 \n2、普通 \n3、困难  \n4、噩梦"));
var hp;
var score = 0;
if (user == 1) {
    hp = 100;
} else if (user == 2) {
    hp = 50;
} else if (user == 3) {
    hp = 25;
} else if (user == 4) {
    hp = 10;
} else {
    alert("恭喜你开启地狱模式");
    hp = 1;
}
$("span:eq(0)").html(hp);
$("span:eq(1)").html(score);
var x = 0;
var y = 0;
$(window).keydown(e => {
    var code = e.keyCode;
    if (code == 65) {
        if (x >= 0 && x <= maxX) {
            x--;
            if (x < 0) {
                x = 0;
                return false;
            }
            div.css("left", parseInt(div.css("left")) - 60 + "px");
        }
    } else if (code == 68) {
        if (x >= 0 && x <= maxX) {
            x++;
            if (x > maxX) {
                x = maxX;
                return false;
            }
            div.css("left", parseInt(div.css("left")) + 60 + "px");
        }
    } else if (code == 87) {
        if (y >= 0 && y <= maxY) {
            y--;
            if (y < 0) {
                y = 0;
                return false;
            }
            div.css("top", parseInt(div.css("top")) - 60 + "px");
        }
    } else if (code == 83) {
        if (y >= 0 && y <= maxY) {
            y++;
            if (y > maxY) {
                y = maxY;
                return false;
            }
            div.css("top", parseInt(div.css("top")) + 60 + "px");
        }
    } else if (code == 66) {
        bag.toggle();
    }
    if (div.css("left") == dr.css("left") && div.css("top") == dr.css("top")) {
        if (dr.html() == "狗屎") {
            hp -= 5;
            dr.remove();
        } else if (dr.html() == "小兵") {
            hp -= 5;
            score += 5;
            dr.remove();
        } else if (dr.html() == "大兵") {
            hp -= 10;
            score += 10;
            dr.remove();
        } else if (dr.html() == "小将") {
            hp -= 15;
            score += 15;
            dr.remove();
        } else if (dr.html() == "大将") {
            hp -= 20;
            score += 20;
            dr.remove();
        } else if (dr.html() == "元帅") {
            hp -= 25;
            score += 25;
            dr.remove();
        } else if (dr.html() == "血包") {
            dr.css("position", "static");
            dr.css("float", "left");
            dr.click(e => {
                console.log(11);
                $(e.target).remove();

hp += 20;
                if (hp >= 100) {
                    hp = 100;
                }
                $("span:eq(0)").html(hp);
                $("span:eq(1)").html(score);
            })
            bag.append(dr);
        }
        $("span:eq(0)").html(hp);
        $("span:eq(1)").html(score);
        createDr();
        if (hp <= 0) {
            alert("game over,得分为：" + score);
            close();
        }
    }
})
var arr = ["血包", "血包", "血包", "血包", "狗屎", "小兵", "小兵", "小兵", "小兵", "大兵", "大兵", "大兵", "小将", "小将", "大将", "元帅"];

function createDr() {
    var r = parseInt(Math.random() * (arr.length - 1 + 1));
    dr = $(`<div>${arr[r]}</div>`);
    var rl = parseInt(Math.random() * (maxX) + 1);
    var rt = parseInt(Math.random() * (maxY) + 1);
    dr.css("left", rl * 60 + "px");
    dr.css("top", rt * 60 + "px");
    $("body").append(dr[0]);
}
createDr()

var bag = $("<div class='bag'><h1>背包</h1></div>");
bag.hide();
$("body").append(bag)

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

立即下载

mmpg游戏



代码描述：利用jQuery中键盘触发

更新时间：2021-05-15 10:23:32
利用jquery中的点击事件，上w 左a 下s 右d 背包b。
随便写了一些 css并没有好好的写

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

取消回复

<!doctype html> <html> <head> <meta charset="utf-8"> <title>mmpg游戏-jq22.com</title> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.3.min.js"></script> <style> </style> </head> <body> <script> </script> </body> </html>

2012-2021 jQuery插件库版权所有

jquery插件| jq22工具库| 网页技术| 广告合作| 在线反馈| 版权声明
沪ICP备13043785号-1 浙公网安备 33041102000314号