打字游戏
Posted asablog
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了打字游戏相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{margin:0;padding: 0}
div{
font-size: 60px;
position: absolute;
}
</style>
</head>
<body>
<P>得分:</P>
</body>
</html>
<script src="../../common.js"></script>
<script>
setInterval(function(){
var n = numRandom(65,122);
while(n>=91 && n<=96){
n = numRandom(65,122);
}
var char = String.fromCharCode(n);
var div = document.createElement("div");
div.innerText = char;
div.style.left = numRandom(200,1200) + ‘px‘;
div.style.top = 0;
div.style.color = randomColorTo();
move(div);
document.body.appendChild(div);
},500)
function move(ele){
ele.timer = setInterval(function(){
var speed = numRandom(1,3);
if(ele.offsetTop >=500){
ele.remove();
clearInterval(ele.timer);
}else{
ele.style.top = ele.offsetTop + speed +‘px‘;
}
},30)
}
document.onkeypress = function(e){
var e = e || event;
var code = e.keyCode || e.which;
var str = String.fromCharCode(code);
var aDiv = document.getElementsByTagName("div");
for(var i=0;i<aDiv.length;i++){
if(str == aDiv[i].innerText){
aDiv[i].remove();
break;
}
}
}
</script>
以上是关于打字游戏的主要内容,如果未能解决你的问题,请参考以下文章