キャンバスのスクラッチオフに関するチュートリアルの例

零下一度
リリース: 2017-07-25 09:37:41
オリジナル
3290 人が閲覧しました

今日は、前の記事の宝くじゲームと組み合わせて、
キャンバスを使用して小さなゲーム、つまりスクラッチオフを作成します。
まず、canvasを使って幅と高さが200pxのキャンバスを作成します。次に、span タグをキャンバスに配置します。

キャンバスのスクラッチオフに関するチュートリアルの例



効果は次のとおりです

キャンバスのスクラッチオフに関するチュートリアルの例



次に、canvasタグを取得し、配列を定義し、canvasを使用してグレーを描画します この部分をスクエアライブ。

キャンバスのスクラッチオフに関するチュートリアルの例



効果は以下の通りです

キャンバスのスクラッチオフに関するチュートリアルの例



マウスが移動すると、キャンバス上の灰色のレイヤーをクリアしてテキストを表示します。以下(1等)。

キャンバスのスクラッチオフに関するチュートリアルの例


効果は次のとおりです

キャンバスのスクラッチオフに関するチュートリアルの例



最後に、定義した配列をランダムにシャッフルし、灰色のレイヤーをクリアすると、さまざまな賞品が表示されます。

キャンバスのスクラッチオフに関するチュートリアルの例



効果は次のとおりです

キャンバスのスクラッチオフに関するチュートリアルの例


お役に立てば幸いです、ありがとう!

以上がキャンバスのスクラッチオフに関するチュートリアルの例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!