古籏一浩のJavaScriptラボ ― 第16回
Yahoo! UI Library 3で驚きのアニメーションを作成
2009年10月20日 11時00分更新
※この記事は「古籏一浩のJavaScriptラボ」の第16回です。過去の記事も合わせてご覧ください。
 |
|---|
YUI 3のアニメーション機能を使ってみよう
9月末にリリースされた「YUI（Yahoo! UI Library）」の最新版「YUI 3」。前回はYUI 3の基本的な使い方と簡単なマウスオーバーのサンプルを作りました。今回はYUI 3のアニメーション機能を使って、Webページに動きを付ける方法を紹介します。
●YUI 3入門のラインナップ
- 第1回 ライブラリの読み込みとイベント処理
- 第2回 YUI 3のアニメーション機能を使う（この記事）
- 第3回 YUI 3を使ったアニメーションスライドショー
 |
|---|
| YUI2のアニメーション解説ページ |
YUI 3には派手なアニメーション機能こそありませんが、前バージョンのYUI 2と同様、UIで使うための基本的な機能が備わっています。記述方法はYUI 2と似ており、設定できるプロパティ名もほとんど同じです。実際にいくつかサンプルを作りながら、アニメーション機能を使ってみましょう。
 |
|---|
| YUI3のアニメーション解説ページ。YUI2とプロパティ名は似ているが若干書き方が変わっている |
 |  | |
|---|---|---|
 | 今回作成するサンプルの最終完成版。上から画像が降ってきて元の表示位置に配置される | |
この連載の記事
- 第53回 Mac用ウィジェットをHTML/CSSで自作
- 第52回 Web技術で作るDashboardウィジェット開発入門
- 第51回 iOS 4.2×localStorageで作るGPSレコーダー
- 第50回 HTML5 SVGで作るシューティングゲーム
- 第49回 HTML5のInline SVGをJavaScriptで操作
- 第48回 HTML5で注目！インラインSVGの使い方
- 第47回 iOS 4.2の新機能で作るHTML5+JSアプリ
- 第46回 JavaScriptでEPUBビューアーを自作してみた
- 第45回 Audio Data APIでブラウザーをシーケンサーに！
- 第44回 Firefoxでソフトシンセも作れるAudio Data APIの使い方
- この連載の一覧へ
![Microsoft Windows7 Home Premium 64bit 日本語 DSP版 + メモリ [DVD-ROM]](http://ascii.jp/img/amazon_noimg70.gif "Microsoft Windows7 Home Premium 64bit 日本語 DSP版 + メモリ [DVD-ROM]")
