ハナモゲラボ / 試行錯誤の実験人生

日々、PCや各種デバイス、楽器等に翻弄されながら電脳の森をさまよう男の日常と様々な実験をさらりと記しております。

めくるめくCSS3のアニメーションの世界

April 11 2014

WindowsXPとIE6のサポートが終わりを告げ、我々の様な制作者も
あの悪夢のような日々から解放されるのか、という想いが少し流れる昨今。
もはやあの日々も思い返せば、それなりにいい想い出なのかも知れない。
「こうして俺のIE制作は終わりを告げた。思えばデバッグばかりしてた気がするなあ」
ときメモのエンディングの様にさらりと語れる日が来たのかも知れない。

【IE6】サポート終了、お世話になったバグを振り返ってみる
http://c-brains.jp/blog/wsg/14/04/11-115200.php

しかしそれは幻想。つかの間の平和。
常に新技術の足を引っ張るのはInternet Explorerその人なのだ。

まず、CSS3の対応状況はこちら。
http://fmbip.com/litmus/

0023

この右側に位置するIEさんの状況そのものが今の現実なのであります。
今や一番古いサポート中のOSとなったWindows Vistaの初期インストールのIEは
バージョン7で、しかも9までしかインストールが出来ない状況。
8以下はHTML5すらデフォルトで認識させる事が出来ないので、
ライブラリであるhtml5shivを適用させる必要がある上に、CSS3なんぞはもう
壊滅的な状況に近くて、PIE.htcを使っても使えるのは5つのみ。
ちなみにCSSセレクタはSelectivizr.jsを使えば6~8でも使用できます。

やっぱり全部の足並みが揃うのはもう10年ぐらいかかりそうな予感が・・・

CSS3アニメーションなんぞを使いまくれる日々はまだまだ先かな。
というわけでCSS3アニメーションってどんな事が出来るのよ、ってのはこちら。

0123

今やCSSだけでこんな事が出来るというのに歯がゆい話ではあります。
このMagic Animations CSS3はとてもわかりやすいデモサイトでして
ここからソースをダウンロード出来るので、勉強にももってこい。
(それなりに表示にマシンパワーがいるみたいですが)

CSSアニメーションの基礎はこの記事がとてもわかりやすかったです。
CSS3アニメーションの基本 (1/3)
http://www.atmarkit.co.jp/ait/articles/1307/04/news002.html

そして僕たちの旅は果てしなく続いてゆくのです。
終わりなき旅路、ああそれこそが。それこそがWeb制作という茨の道なんだね。

| Posted in CSS | Comments (2)

2 Comments

  1. えりー
    Posted 2014年4月28日 at 3:06 PM |

    すーーーげーー!!こんなに色んなことが・・・!
    わくわくするんと同時にひどくげっそりした気が・・・w
    いつまでたってもぜんっぜん知識も技術も追いつきませんん\(^o^)/

  2. Gaku@管理人
    Posted 2014年4月30日 at 4:52 AM |

    >えりーちゃん
    こっちでは初めまして(笑)コメントありがとー!
    すごいよなーこれ。
    でも多分安心して使えるのはたいぶ先になりそうな気が・・・

    自分もアップアップしながらなんとか食いついて行ってる状況です。
    ま、だからこそ面白いんやけどね!

    共に頑張っていきましょうぞ。

Post a Comment

※メールアドレス、URLは任意入力です。メールアドレスは入力しても公開されません。

« Apr 2017 May 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31