Blog

Canvasで渦巻きの切り替えアニメーション

2016.10.18Cat:Canvas デザイナー
nino-eye

以下のサイトのように、Canvasを使って画面の切り替えを行うサイトを見かけるときがあります。
https://recruit.relationsgroup.co.jp/

今回は、渦巻きで切り替わるアニメーションを作ってみましたので、
ご紹介いたします。

渦巻きのプログラムは以下のサイトを参考にさせていただきました。

「情報」授業用 プログラミング演習:図形描画プログラムを作ろう

↓作ってみた物
DEMO

コード

HTML

CSS

JavaScript

 

Author Profile

ninomiya
ninomiya
Webデザイナー兼コーダーです。 イラストを描くのも好きです。 SVGとCanvasを使ったWEBアプリにも興味があります。 よろしくお願いいたします。
» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ