. .
优选
使用canvas + js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
th,brick_height);
//创立50个砖块
var bricks = new Array();
for(i=0;i<50;i++){
//focuson: 注意if里面的条件
if(brick_x + brick_width > ){
brick_x = 23;
brick_y += brick_height + y_off;
}
//focuson:注意顺序,先创立一个砖块,然后再给x坐标++;
. .
优选
var brick = new Brick(brick_x,brick_y,brick_width,brick_height);
brick_x += brick_width + x_off;
(brick);
}
//挡板:创立挡板
var box_x = 10;
var box_y = 280;
var box_width = 80;
var box_height = 15;
//定义方法,让挡板跟随鼠标移动
= function(e){
box_x = - + 200;
}
//去除小球轨迹
function clearcanvas(){
();
. .
优选
="black";
(0,0,,);
();
}
setInterval(function(){
//去除小球移动痕迹
clearcanvas();
//绘制小球
="aqua";
(ball_x,ball_y,ball_r,0,2*,false);
();
//绘制一个砖块
// ="aqua";
// (,,,);
. .
优选
//绘制50个砖块
="aqua";
for(i=0;i<;i++){
//如果砖块是显示状态,才显示;
if(bricks[i].isShow){
(bricks[i].x,bricks[i].y,bricks[i].width,bricks[i].height);
}
/*
* 判断并设置砖块的显示状态
html5打砖块游戏canvas 来自淘豆网m.daumloan.com转载请标明出处.