言語/Language: ja
JavaScriptでブロック崩し
JavaScriptオンリーのブロック崩しの実装です。
単なるブロック崩しじゃつまらんので、外部関数にしてライブラリとして使えるようにしてみました。
さらに画像を使って脱衣ブロック崩しもできる仕様にしてみたｗ
使い方
HTMLファイルを作成し、headタグ内に以下のように書いてください。
<script type="text/javascript" src="block.js"></script>
bodyタグには何も書かなくておｋ。
このタグより前にJavaScriptでonInitという関数を定義しておくと、初期化前に読み込まれます。onInitの中で設定変数を変更することができます。block.js自身を書き換える必要はありません。
onInit()において設定可能な変数は以下のとおりです。
| 名称 | 説明 |
|---|---|
| stageHeight | ステージの高さ、ピクセル単位の整数 |
| backgroundColor | ステージの背景色、HTMLの指定方式 |
| backgroundMarginLeft | ステージの左の余白、ピクセル単位の整数 |
| backgroundMarginTop | ステージの上の余白、ピクセル単位の整数 |
| backgroundMarginRight | ステージの右の余白、ピクセル単位の整数 |
| backgroundMarginBottom | ステージの下の余白、ピクセル単位の整数 |
| blockLeft | ステージの左右端からブロックまでの余白、ピクセル単位の整数 |
| blockTop | ステージの上端からブロックまでの余白、ピクセル単位の整数 |
| blockCountX | 横方向のブロック数 |
| blockCountY | 縦方向のブロック数 |
| blockWidth | ブロック1つの幅、ピクセル単位の整数 |
| blockHeight | ブロック1つの高さ、ピクセル単位の整数 |
| blockColors | ライフごとのブロックの色、HTMLの指定方式 |
| blockImagePaths | ライフごとのブロックの画像のパス、要素数はブロックのライフの最大値＋1とすること、画像がない場合は要素を空文字列にする |
| barY | バーの上端の座標、ピクセル単位の整数 |
| barWidth | バーの幅、ピクセル単位の整数 |
| barHeight | バーの高さ、ピクセル単位の整数 |
| barColor | バーの色、HTMLの指定方式 |
| ballRadius | ボールの半径、ピクセル単位の整数 |
| ballColor | ボールの色、HTMLの指定方式 |
| penetrateBallColor | 貫通弾の色、HTMLの指定方式 |
| messageColor | メッセージの色、HTMLの指定方式 |
| messageFontSize | メッセージのサイズ、「100%」などCSSで使用する形式 |
| maxLife | プレイヤーの最大ライフ |
| penetrateRegionWidth | 打ち返すと貫通弾となる領域の幅、ピクセル単位の整数 |
| maxClearMessageCount | クリアのメッセージが消えるまでのカウント（フレームレートは30） |
| initialBlockLives | ブロックのライフの初期値の配列、要素数はブロック数と同じにすること、nullならぜんぶ1を指定するのと同じ |
| startMessage | 開始時のメッセージ、${life}はプレイヤーのライフに置換される |
| gameoverMessage | ゲームオーバー時のメッセージ |
| clearMessage | クリア時のメッセージ |
Copyright © 2009-2017 recyclebin5385 All rights reserved.
Generated by webgen