[JS]画像をモザイク状に切り替えるスライドショーを実装するチュートリアル

切り替え時のアニメーションにはフェードやスライドのアニメーションがよく使用されていますが、ちょっと変わったタイル状に推移していくエフェクトをもったスライドショーを実装するチュートリアルをTutorialzineから紹介します。

Making a Mosaic Slideshow With jQuery & CSS
デモページ

スライドショー自体は、シンプルなHTMLで実装されています。

HTML

スクリプトのベースにはjQueryが使用されており、CSSは角丸でCSS3が使用されています。

スクリプトやスタイルシートはサイトでも公開されていますが、全ファイルをダウンロードすることもできます。