游戏类游戏：打砖块
把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件要完成此效果需要三个步骤
第一步：把如下代码加入到<head>区域中
<script language="javascript">
<!--
var timerid = null
var int = 10
var loadflg=0
var gameflg=0
var missflg=0
var tim = 0
var blcol = new array(5) //砖块颜色
var blsta = new array(40) //砖的状态
var blclr = 0 //是否打完砖块的标志
var ballx = 0 //球的相关参数
var bally = 0
var balln = 3
var balldx= 0
var balldy= 0
var tmprl = 193
var keyp=0
var keypr=0
var endflg=0
blcol="#ffff00"
blcol="#ffb000"
blcol="#ff8000"
blcol="#ff4000"
blcol="#ff0000"
blcol="#9999ff"
var ieflg=0
var n4flg=0
if (document.all){
ieflg=1
}else{
if (document.getelementbyid){
n4flg=0
}else{
n4flg=1
}
}
// 主函数
function mainf(){
cleartimeout(timerid)
tim=tim+1
with (math){tmptim=floor(tim/10)}
tmptc=""
tmptb=tim/10
if (tim==tmptim*10){tmptc=".0"}
ballx=ballx+balldx
bally=bally+balldy
outchk()
blkchk()
if (document.getelementbyid){
document.sc.tm.value=tmptb+tmptc
document.sc.cl.value=blclr
document.sc.sr.value=blclr*200-tim
document.getelementbyid("ball").style.top =bally
document.getelementbyid("ball").style.left = ballx
}else{
if (ieflg==1){
document.sc.tm.value=tmptb+tmptc
document.sc.cl.value=blclr
document.sc.sr.value=blclr*200-tim
ball.style.postop = bally
ball.style.posleft = ballx
}else{
document.layers["info"].document.forms.tm.value=tmptb+tmptc
document.layers["info"].document.forms.cl.value=blclr
document.layers["info"].document.forms.sr.value=blclr*200-tim
document.layers["ball"].moveto(ballx,bally)
}
}
racketmove()
if (gameflg==1){timerid = settimeout("mainf()",int)}
}
//子函数
//game init
function initg(){
keyp=0
if (endflg == 0){
endflg=1
blclr=0
tim=0
balln=3
with (math){tmptim=floor(tim/10)}
if (document.getelementbyid){
document.sc.tm.value=tmptim
document.getelementbyid("ovrmes").style.top=-1000
document.getelementbyid("clrmes").style.top=-1000
}else{
if (ieflg==1){
document.sc.tm.value=tmptim
clrmes.style.top=-1000
ovrmes.style.top=-1000
}else{
document.layers["info"].document.forms.tm.value=tmptim
document.layers["ovrmes"].visibility="hide"
document.layers["clrmes"].visibility="hide"
}
}
for (ib=0; ib<5; ib++){for (ia=0; ia<8; ia++){
tmpidn=ib*8+ia+1
if (document.getelementbyid){
document.getelementbyid(tmpidn).style.backgroundcolor = blcol
}else{
if (ieflg==1){
document.all(tmpidn+9).style.backgroundcolor = blcol
}else{
document.layers.bgcolor=blcol
}
}
blsta=ib
}}
}
if (document.getelementbyid){
document.sc.bl.value=balln
document.getelementbyid("starter").style.top=-1000
}else{
if (ieflg==1){
document.sc.bl.value=balln
starter.style.top=-1000
}else{
document.layers["info"].document.forms.bl.value=balln
document.layers["starter"].visibility="hide"
}
}
gameflg=1;loadflg=1
ballx=209;bally=270;balldx=-8;balldy=-8;tmprl=193;missflg=0
timerid = settimeout("mainf()",int)
}
function keydown(dnevents){
if (ieflg==0){
k=dnevents.which
}else{
k=window.event.keycode
}
if (k == 54){keyp=5} //6
if (k == 102){keyp=5} //6
if (k == 52){keyp=-5} //4
if (k == 100){keyp=-5} //4
if (k == 83){if (gameflg==0){initg()}} //s
if (k == 115){if (gameflg==0){initg()}} //s
}
function keyup(upevents){
if (ieflg==0){
k=upevents.which
}else{
k=window.event.keycode
}
if (k == 102){keyp=0} //6
if (k == 54 ){keyp=0} //4
if (k == 100){keyp=0} //6
if (k == 52 ){keyp=0} //4
}
//racket move
function racketmove(){
if (loadflg==1){
if (keyp != 0){
tmpkeyp=keyp*keypr
if (tmpkeyp>=0){
if (keypr != 0){
if (math.abs(keypr)<15){keypr=keypr*1.2}
}else{
keypr=keyp
}
}else{
keypr=keyp
}
}else{
keypr=0
}
tmprl=tmprl+keypr
if (tmprl<16){tmprl=16}
if (tmprl>370){tmprl=370}
if (document.getelementbyid){
document.getelementbyid("racket").style.left=tmprl
}else{
if (ieflg==1){
racket.style.left=tmprl
}else{
document.layers["racket"].left=tmprl
}
}
}
}
//wall and racket check
function outchk(){
if (ballx < 16){ballx=32-ballx;balldx=-balldx}
if (ballx > 401){ballx=802-ballx;balldx=-balldx}
if (bally < 16){bally=32-bally;balldy=-balldy}
if (bally >= 272){
if (missflg==0){
tmpx=(balldx/balldy)*(272-bally)+ballx
if (tmpx >= tmprl-12){
if (tmpx <= tmprl+42){
bally=272;balldy=-balldy
ballx=tmpx
ballrd=tmpx-tmprl
with (math){balldx=8*abs(balldx)/balldx}
if (ballrd<-4){balldx=-15}
if (ballrd>36){balldx=15}
if (ballrd>=14){if (ballrd<=16){balldx=-2}}
if (ballrd>=17){if (ballrd<=20){balldx=2}}
if (ballrd>=0){if (ballrd<=4){balldx=-4}}
if (ballrd>=28){if (ballrd<=32){balldx=4}}
if (ballrd>=-4){if (ballrd<=-1){balldx=-11}}
if (ballrd>=33){if (ballrd<=36){balldx=11}}
}
}
if (balldy>0){missflg=1}
}else{
if (bally>290){missflg=0;balln=balln-1;gameend()}
}
}
}
//block check
function blkchk(){
tmpy=bally+4;tmpx=ballx+4
if (tmpy>=48){if (tmpy<=147){if (tmpx>=29){if (tmpx<=396){
with (math) {
ia=floor((tmpx-29)/46);ib=floor((tmpy-48)/20);ic=ib*8+ia
}
if (blsta<=4){
tmpbc=blsta+1
blsta=tmpbc
tmpidnc=ic+1
if (document.getelementbyid){
document.getelementbyid(tmpidnc).style.backgroundcolor = blcol
}else{
if (ieflg==1){
document.all(tmpidnc+9).style.backgroundcolor = blcol
}else{
document.layers.bgcolor=blcol
}
}
if (tmpbc==5){blclr=blclr+1}
if (blclr >= 40){gameend()}
if (balldx>0){
iy=(balldy/balldx)*(29+46*ia-tmpx)+tmpy
if (iy>48+20*ib+18){
tmpy1=48+20*ib+18
tmpx1=(balldx/balldy)*(48+20*ib+18-tmpy)+tmpx
ballx=tmpx1-4;bally=tmpy1-4
balldy=-balldy
}else{
if (iy<44+20*ib){
tmpy1=48+20*ib
tmpx1=(balldx/balldy)*(48+20*ib-tmpy)+tmpx
ballx=tmpx1-4;bally=tmpy1-4
balldy=-balldy
}else{
tmpx1=29+46*ia
tmpy1=(balldy/balldx)*(29+46*ia-tmpx)+tmpy
ballx=tmpx1-4;bally=tmpy1-4
balldx=-balldx
}
}
}else{
iy=(balldy/balldx)*(29+46*ia+44-tmpx)+tmpy
if (iy>48+20*ib+18){
tmpy1=48+20*ib+18
tmpx1=(balldx/balldy)*(48+20*ib+18-tmpy)+tmpx
ballx=tmpx1-4;bally=tmpy1-4
balldy=-balldy
}else{
if (iy<44+20*ib){
tmpy1=48+20*ib
tmpx1=(balldx/balldy)*(48+20*ib-tmpy)+tmpx
ballx=tmpx1-4;bally=tmpy1-4
balldy=-balldy
}else{
tmpx1=29+46*ia+44
tmpy1=(balldy/balldx)*(29+46*ia+44-tmpx)+tmpy
ballx=tmpx1-4;bally=tmpy1-4
balldx=-balldx
}
}
}
}
}}}}
}
//game end
function gameend(){
gameflg=0
loadflg=0
if (document.getelementbyid){
document.sc.bl.value=balln
document.getelementbyid("starter").style.top=200
if (blclr >= 40){
document.getelementbyid("clrmes").style.top=150
endflg=0
}
if (balln <= 0){
document.getelementbyid("ovrmes").style.top=160
endflg=0
}
}else{
if (ieflg==1){
document.sc.bl.value=balln
starter.style.top=200
if (blclr >= 40){
clrmes.style.top=150
endflg=0
}
if (balln <= 0){
ovrmes.style.top=160
endflg=0
}
}else{
document.layers["info"].document.forms.bl.value=balln
document.layers["starter"].visibility="show"
if (blclr >= 40){
document.layers["clrmes"].visibility="show"
endflg=0
}
if (balln <= 0){
document.layers["ovrmes"].visibility="show"
endflg=0
}
}
}
}
//event init
function onld(){
document.onkeydown = keydown
document.onkeyup = keyup
if (document.getelementbyid){
document.getelementbyid("starter").style.top=200
document.getelementbyid("info").style.top=16
}else{
if (ieflg==1){
starter.style.top=200
info.style.top=16
}else{
document.layers["starter"].visibility="show"
}
}
if (n4flg!=0){document.captureevents(event.keydown|event.keyup)}
}
//-->
</script>
第二步：把如下代码加入到<body>区域中
<a name="t0"></a>
<div id="gamewindow" style="position:absolute; background-color:#9999ff; width:394px; height:300px">
<layer clip="0,0,393,299" bgcolor="#000000" left="331" top="186"></layer>
</div>
<script language="javascript">
<!--
//block layer write
for (ib=0; ib<5; ib++){
for (ia=0; ia<8; ia++){
tmpl=31+46*ia;tmpt=50+20*ib
tmpidn=ib*8+ia+1
if (n4flg!=1){
document.write("<div id='"+tmpidn+"' style='position:absolute; background-color:"+blcol+"; top:"+tmpt+"px; left:"+tmpl+"px; width:42; height:16; clip:rect(0,43,17,0)'></div>")
}else{
document.write("<layer left="+tmpl+" top="+tmpt+" clip='1,1,43,17' bgcolor='"+blcol+"'></layer>")
}
blsta=ib
}
}
//-->
</script>
<div id="ball" style="position:absolute; top:270px; left:209px; width:8px; height:8px">
<div style="position:absolute; top:0px; left:2px; background-color:#b0b0b0; width:4; height:8; clip:rect(0,3,7,0)"></div>
<div style="position:absolute; top:16px; left:16px; background-color:#b0b0b0; width:8; height:4; clip:rect(0,7,3,0)"></div>
<div style="position:absolute; top:16px; left:16px; background-color:#ffffff; width:6; height:6; clip:rect(0,5,5,0)"></div>
</div>
<div id="racket" style="position:absolute; top:292px; left:190px; background-color:#ffd700; width:100px; height:4px; clip:rect(0,39,3,0)"></div>
<script language="javascript">
<!--
if (n4flg==1){
document.write('<layer name="ball" left="209" top="270" clip="0,0,7,7"> <layer left="2" top="0" clip="0,0,3,7" bgcolor="#b0b0b0"></layer><layer left="0" top="2" clip="0,0,7,3" bgcolor="#b0b0b0"></layer><layer left="1" top="1" clip="0,0,5,5" bgcolor="#ffffff"></layer></layer><layer name="racket" left="193" top="280" clip="0,0,39,3" bgcolor="#b0b0ff"></layer><layer name="info" left="416" top="16">')
}else{
document.write('<div id="info" style="position:absolute; top:-1000px; left:416px">')
}
//-->
</script>
<br>
<p>
<form name="sc">
<div align="right">球的个数:
<input type="text" name="bl" size=5 value = "3" >
<br>
<br>
时 间:
<input type="text" name="tm" size=5 value = "0" >
<br>
<br>
打掉砖块:
<input type="text" name="cl" size=5 value = "0" >
<br>
<br>
得 分:
<input type="text" name="sr" size=5 value = "0" >
<br>
<br>
</div>
<p><br>
</form>
<script language="javascript">
<!--
if (n4flg==1){
document.write('</layer><layer name="clrmes" top=150 left=160 visibility="hide">')
}else{
document.write('</div><div id="clrmes" style="position:absolute; top:-1000px; left:160px; visibility:visible">')
}
//-->
</script>
<font style="font-size:24px" color="#44cc44">all clear!</font>
<script language="javascript">
<!--
if (n4flg==1){
document.write('</layer><layer name="ovrmes" top=150 left=160 visibility="hide">')
}else{
document.write('</div><div id="ovrmes" style="position:absolute; top:-1000px; left:160px; visibility:visible">')
}
//-->
</script>
<font style="font-size:24px" color="#cc4444">game over!</font>
<script language="javascript">
<!--
if (n4flg==1){
document.write('</layer><layer name="starter" top=200 left=90 visibility="hide"><font color="#ffffff">')
}else{
document.write('</div><div id="starter" style="position:absolute; top:-1000px; left:90px; color:#ffffff; visibility:visible">')
}
//-->
</script>
开始:start = s key<br>
方向键(小键盘):left= 4 key<br>
right = 6 key<br>
第三步：把“onload="onld()"”加在<body>标记里
例如：<body onload="onld()">
页:
[1]