3×3スライドパズル – all about hirata

２０１７年制作。
css3より導入されたgridレイアウトを使ってのスライドパズルです。
画像１枚指定するだけで、簡単にパズル化することができます。

・技術
javascriptでパズル部分を、パネルの配置と移動をgridレイアウト＋jQueryを使用しています。
画像もCSSによるバックグラウンドの位置指定で、それぞれの画像を作成しなおす処理はおこなっていません。そのため、ユーザさまが用意するのは、正方形の画像一枚だけ！の簡単導入が可能です。