第17回 アニメーションの基礎 | gihyo.jp

こんにちは、太田です。3回ほどJavaScriptの基礎的な内容が続いたので、今回はグラフィカルなアニメーションについて解説します。グラフィカルなJavaScriptというと、難しい・応用的なイメージがあるかもしれませんが、JavaScriptでのアニメーションとはすなわちCSSを段階的に操作するということで、そのポイントを抑えれば中身は単純なものです。 アニメーションの前提知識 HTMLにおける通常のアニメーションを構成するのは、「⁠特定の要素」に対して、「⁠そのCSSプロパティ」を「ある時点からある時点まで」の時間の中で、「⁠ある値からある値に操作」する、といった要素です。 特定の要素と、CSSプロパティについては問題ないと思います。問題となるのは「時間と値の操作」です。 まず、単純にインクリメントするだけというサンプルを見てみましょう。 良くないアニメーション var y = 0;

[kana321]

アニメーションの基礎

[big_hama]

create to easing for animation

[octopus553]

[][アニメーション]

[hmy-k]

アニメーションかっこよい

[jimmy0024ko]

PCスペックに依存しない書き方

[graceful_life]

Tween使えたのか

[Gesaku_G]

むー。よくわかんねぇ / これでできる！ クロスブラウザJavaScript入門：第17回　アニメーションの基礎 #gihyojp

[me_1230]

みぃ姉 の Google リーダー スター付きアイテム --------------------------- 第4回　jQueryでアニメーション（お題編） ── 読んで覚える，触って体験！JavaScript＆CSS3～gihyo.jp×jsdo.it presents -------------------------------------------------------------

[yat8823jp]

アニメーションライブラリ

[janus_wel]

時間を基準にした code を書く手法

[efcl]

CSSアニメーション。Tween