码迷,mamicode.com
首页 > 其他好文 > 详细

打字游戏

时间:2019-04-18 20:25:42      阅读:149      评论:0      收藏:0      [点我收藏+]

标签:||   ati   color   offset   meta   ESS   style   from   rand   

<!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>

打字游戏

标签:||   ati   color   offset   meta   ESS   style   from   rand   

原文地址:https://www.cnblogs.com/asablog/p/10731718.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!