PREMIUM

JavaScriptで15パズルを作ろう

JavaScriptのクラス構文を使って15パズルを作る方法を見ていきます。
0%
#01 15パズルを作ってみよう
#02 Canvas要素を配置しよう
#03 Puzzleクラスを作っていこう
#04 指定したタイルを切り出そう
#05 実装方針を確認しよう
#06 drawImageで画像を切り出そう
#07 すべてのタイルを描画しよう
#08 クリックイベントを設定しよう
#09 クリックした位置を求めよう
#11 クリックしたタイルを入れ替えよう
#12 空白のタイルを動かしてみよう
#13 タイルをシャッフルしてみよう
#14 switch文を書き換えてみよう
#15 移動距離の差分を配列にまとめよう
#16 swapTilesも書き換えてみよう
#19 クリア判定を実装していこう
#20 不具合を修正していこう
#22 Puzzleクラスにアクセスしよう