こんにちは。受託開発担当のMasaです。 前回 TweenJSの記事の続きで、今回はテキストのアニメーションを紹介します。 前回の予告では TweenJS を拡張した JSTween プロジェクトの TextTween を紹介すると書きましたが、コンストラクタを呼び出すだけで終わってしまうため、EaselJS + TweenJS でのテキストアニメーションを紹介することにしました。 有名なフレームワークなので説明は省略します。尚、現在の最新バージョンは v7.0 なのでこれを使用します。 とりあえず何かテキストを表示します。 canvas は必ず必要です。Stage は最上位のコンテナで、update することで子オブジェクトを描画します。 <!DOCTYPE html> <head> <script src='easeljs-0.7.0.min.js'></script> <script
テキストアニメーションで、一番問題になるのがフォントの種類の指定が容易に出来ないことです。Google WebFont を利用してテキストをアニメーションして見ます。 英字のみですが最近は種類も増えましたので、大変便利です。 easeljs-0.7 でのテストです。 CreateJS WebFont テキストアニメーションのテスト フォントは 表情、感情、個性、を持ちますので、その時のコンテンツ表現に最適なフォントを使用するのも方法の一つで、ビジュアルデザインに大きく影響を与える要素です。 Google WebFont は簡単に取り込み使用出来ます。 DEMO CreateJS WebFont テキストアニメーションのテストデモ、(createJS041.js) このページはHTML5では有りませんので、デモページでご覧ください。「IE7.8」ではご覧いただけません。 /// 注意、ブラウ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
