chevron_left

CSS実践 レイアウト・アニメーションを極める

PREMIUM

スライド資料

会員登録して、全てのスライドを見よう

1 / 12

授業の概要

animationを理解する

CSS実践 レイアウト・アニメーションを極める (全5回)最終回です。
css3の登場で快適に動くanimationプロパティがいくつも登場しました。マウスオーバーの概念の無いスマホサイトでは、アイコンやボタンなどが動いていると注意を引きつける事ができます。モバイルフレンドリーなサイトを魅力的にするanimation手法をこの授業でマスターしましょう。

こんな人にオススメ

css3 Animationを習得したい方

授業で使用する教材

※授業以外での使用は禁止します

チャプター

play_arrow
自己紹介&アジェンダ
01:22
play_arrow
animationの指定の仕方
06:12
play_arrow
ふわっとさりげなくがポイントのanimationを書いていこう
02:13
play_arrow
animation1を書いていこう
05:15
play_arrow
animation2を書いていこう
02:32
play_arrow
animation1を調整していこう
03:38
play_arrow
animation1の位置を調整しよう
03:59
play_arrow
hoverを書いていこう
06:38
play_arrow
bodyの色を指定しよう
05:55
play_arrow
animation6を書いていこう
06:08
play_arrow
まとめ
00:44
play_arrow
Q:カラーピッカーの出し方のおさらい
02:42
play_arrow
Q:durationはs(秒)単位のようですが、ms(ミリ秒)単位の設定は出来ますか?
00:27
play_arrow
Q:画面スクロールして表示された時にアニメを開始ってのはjsとかjqueryじゃないと難しいですか?
01:06
play_arrow
Q:anime3はどうしてループするのですか?
01:11
play_arrow
Q:消えそうで消えない文字は、色を変えたりもできますか?
03:25
play_arrow
Q:サブライムエディター+プラグインのようなもので、windowsでのオススメの制作環境、ツールの組み合わせなどありますか?
01:42
play_arrow
Q:animationなどの、CSS3は主要なスマホなら、ペンダープレフィックスをつければほぼ問題なく使える状態になっていますか?
01:53
play_arrow
Q:ドリームウィーバーでもエメット使えますか?