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