强大的javascript写劲舞团

<html><head><title>Demo - 网页劲舞团 V0.1 By Xqin</title>
<meta http-equiv=Content-Type content="text/html; charset=gb2312">
</head>
<body>
<FIELDSET id=Demo5 style="HEIGHT:500px">
<h3>Demo - 网页劲舞团 V1.0 By Xqin</h3>

<div id="ShowKeyMode" align="center" style="margin-top:200px;height:80;">
<div id="KeyMode" style="position:relative;font-size:12px;width:500px;height:70px;padding-top:5px;line-height:60px;background:#fafafa;border:solid 1px #ccc;filter:progid:DXImageTransform.microsoft.dropshadow(offX=3,offY=4,color=#eeeeee)"></div>
</div>

<div id="ShowUserPressKey" align="center" style="margin-top:20px;height:80;">
<div id="PressKey" style="position:relative;width:640px;height:70px;padding-top:5px;line-height:60px;background:#fafafa;border:solid 1px #ccc;filter:progid:DXImageTransform.microsoft.dropshadow(offX=3,offY=4,color=#eeeeee)"></div>
</div>

<div id="ShowProccess" align="center" style="margin-top:10px;height:30;">
<div id="Press" style="position:relative;width:250px;height:26px;padding-left:100px;padding-top:2px;line-height:60px;background:#fafafa url( http://test12.howvnet.cn/xiaoqin/jwt/bg.gif) no-repeat fixed 0px 1px;border:solid 1px #ccc;filter:progid:DXImageTransform.microsoft.dropshadow(offX=3,offY=4,color=#eeeeee)">
<img src=" http://test12.howvnet.cn/xiaoqin/jwt/p.gif" style="position:absolute;margin-top:6px;">
</div>
<div id="sStatus" style="position:absolute;margin-right:0px;z-index:2"></div>
</div>

<div id="Status" style="position:absolute;bottom:0px;left:100px;right:100px;width:824px;height:150px;font-size:12px;color:#FF0000;border:1px solid #FF0000;overflow:auto;"></div>
</FIELDSET>
<script>
var keyNum,keyMode,myID,keyStr,debug,gSpeed,uScore;
keyNum = 0;  //用户所需按键按键记数器
uKeyNum = 0;  //用户按键记数器
keyMode = 5;  //按键模式
myID = "Xq"; //标记名字
keyStr = "";  //记录按键
uScore = 0;  //用户分数
//debug = true; //是否调试程序
debug = false; //是否调试程序
if(!debug)$("Status").style.display="none";
window.onload  = showKey;
document.onkeydown = CheckKey;
//---函数定义区域开始
//******************************************************************************
function $(ID){return document.getElementById(ID);}
function showKey(){
var ti;
for(ti=0;ti<keyMode;ti++){
  makeKey();
}
}
//******************************************************************************
function showStatus(){
$("KeyMode").innerHTML=("<span style=\"color:#FF0000;font-size:12px;\">现在的按键模式为："+keyMode+"键模式</span>");
}
//******************************************************************************
function makeKey(){
var kCode = parseInt(Math.random()*4)+37;
if(keyNum>=keyMode)return;
if(37==kCode){  // 37 左
  $("PressKey").innerHTML+=("<span id=\""+myID+keyNum+"\" style=\"color:#FF0000;font-size:35px;width:50;height:50;\">"+getKey(kCode)+"</span>");     //左
  keyStr += "1";
}
if(38==kCode){  // 38 上
  $("PressKey").innerHTML+=("<span id=\""+myID+keyNum+"\" style=\"color:#FF0000;font-size:35px;width:50;height:50;\">"+getKey(kCode)+"</span>");     //上
  keyStr += "2";
}
if(39==kCode){  // 39 右
  $("PressKey").innerHTML+=("<span id=\""+myID+keyNum+"\" style=\"color:#FF0000;font-size:35px;width:50;height:50;\">"+getKey(kCode)+"</span>");     //右
  keyStr += "3";
}
if(40==kCode){  // 40 下
  $("PressKey").innerHTML+=("<span id=\""+myID+keyNum+"\" style=\"color:#FF0000;font-size:35px;width:50;height:50;\">"+getKey(kCode)+"</span>");     //下
  keyStr += "4";
}
keyNum++;
if(debug)$("Status").innerText=$("PressKey").innerHTML+keyStr;
}
//******************************************************************************
function getKey(kCode){
if(40==kCode){
  return("↓");
}
if(39==kCode){
  return("→");
}
if(38==kCode){
  return("↑");
}
if(37==kCode){
  return("←");
}
}
//******************************************************************************
function CheckKey(){   //37 1; 38 2; 39 3; 40 4;
var kCode = event.keyCode;
if((kCode==32 || kCode==17) && uKeyNum>=keyMode){
  var uStatus;
  uStatus = parseInt($("Press").style.backgroundPosition);
  $("sStatus").innerHTML="";
  if(uStatus>190 && uStatus < 210){$("sStatus").innerHTML="<span style=\"font-size:18px;color:#F00;\">漂亮</span>";uScore+=parseInt(Math.random()*5+50);}
  if(uStatus>210 && uStatus < 230){$("sStatus").innerHTML="<span style=\"font-size:18px;color:#F00;\">好</span>";uScore+=parseInt(Math.random()*5+30);}
  if(uStatus>170 && uStatus < 190){$("sStatus").innerHTML="<span style=\"font-size:18px;color:#F00;\">一般</span>";uScore+=parseInt(Math.random()*5+10);}
  if(uStatus<170 || uStatus > 210){
   $("sStatus").innerHTML="<span style=\"font-size:18px;color:#F00;\">Miss</span>";
   uScore+=parseInt(Math.random()*5);
   $("PressKey").innerHTML="";
   $("Press").style.backgroundPosition=0;
   bPos = 0;
   uKeyNum = 0;
   keyNum = 0;
   keyStr = "";
   showKey();
  }
  $("sStatus").innerHTML+=("</br>你现在的分数是:"+uScore);
}
if(uKeyNum>=keyMode){
  $("PressKey").innerHTML="";
  uKeyNum=0;
  keyNum=0;
  keyStr="";
  showKey();
}
if(kCode>40 || kCode<37)return;  //空格的按键值为32 Ctrl键17
var tj,Tkey;      //Like KeyStr=32443333
  Tkey = keyStr.substring(uKeyNum,uKeyNum+1);
  if((parseInt(Tkey)+36).toString()==kCode){
   $(myID+uKeyNum).style.backgroundColor="#008000";
   uKeyNum++;
  }else{
   for(tj=0;tj<uKeyNum;tj++){
    $(myID+tj).style.backgroundColor="";
   }
   uKeyNum=0;
  }
}
//******************************************************************************
var bPos;
bPos = 0;
gSpeed = 100;  //小球移动速度
function runProcess(){
if(parseInt($("Press").style.backgroundPosition)>230)bPos=0;
$("Press").style.backgroundPosition=bPos;
bPos+=11;
if(uScore>1000){
  keyMode = 9;
  gSpeed=85;
  showKey();
}else{
  if(uScore>700){
   keyMode = 8;
   gSpeed=88;
   showKey();
  }else{
   if(uScore>500){
    keyMode = 7;
    gSpeed=92;
    showKey();
   }else{
    if(uScore>200){
     keyMode = 6;
     gSpeed=96;
     showKey();
    }
   }
  }
}
showStatus();
setTimeout("runProcess()",gSpeed);
}
setTimeout("runProcess()",2000);
</script>
</body>
</html>

强大的javascript写劲舞团相关推荐

9 条非常强大的 JavaScript 技巧
本文讲述了 9 条非常强大的 JavaScript 技巧. 作者 | Klaus 译者 | 弯月,责编 | 屠敏出品 | CSDN(ID:CSDNnews) 以下为译文: 全部替换我们知道stri ...
好用又强大的JavaScript 框架介绍
JavaScript框架 JavaScript 是开发领域的重要技术之一.根据 Statista 的报告,JavaScript 是 2019年开发人员使用的最流行的编程语言,在2020年亦是如此. 然 ...
使用JavaScript写的操作系统和输入法程序
JavaScript是一门客户端的脚本语言,但是你千万不要认为它功能弱哦,因为你看了下面的例子之后就明白了. 一. 用JavaScript写的操作系统呵呵,那天同事开玩笑说,要是有个用JS写的操作系 ...
看网友写的JavaScript写的操作系统和输入法程序NB了
JavaScript是一门客户端的脚本语言,但是你千万不要认为它功能弱哦,因为你看了下面的例子之后就明白了. 一. 用JavaScript写的操作系统呵呵,那天同事开玩笑说,要是有个用JS写 ...
使用JavaScript写的操作系统和输入法程序,太强了!
JavaScript是一门客户端的脚本语言,但是你千万不要认为它功能弱哦,因为你看了下面的例子之后就明白了. 一. 用JavaScript写的操作系统呵呵,那天同事开玩笑说,要是有个用JS写的操作系 ...
JavaScript写贪吃蛇游戏，代码思路都有，想学的自己看
JavaScript写一个贪吃蛇的游戏(附源码) javascript群内每日课题-今日课题:JavaScript写一个贪吃蛇的游戏 PS:最近群内很多伙伴想要做游戏学学,练练自己的JavaScrip ...
功能强大的JavaScript 拖拽库 SortableJS
功能强大的JavaScript 拖拽库 SortableJS 官网:http://www.sortablejs.com/ 示例: 配置项: var sortable = new Sortable(el ...
【译】用JavaScript写一个区块链
原文:Writing a tiny blockchain in JavaScript 作者:Savjee.be 译者:JeLewine 几乎每个人都听说过像比特币和以太币这样的加密货币,但是只有极少数 ...
非常强大的shell写的俄罗斯方块
非常强大的shell写的俄罗斯方块网上看到的一个用linux的shell脚本写的俄罗斯方块.是我至今见过写的最牛逼的shell了.共享一下. 原作者信息在脚本的注释中有. 下载地址:点击下载 [pl ...

强大的javascript写劲舞团

强大的javascript写劲舞团相关推荐

最新文章

热门文章