スマートフォン用にアニメーションをjQueryとcss3で作ったので便利だったページをメモ

PCサイト用のFlashをスマートフォン用にjQueryとcss3で書きなおしました。
便利だったページをメモします。

基本機能を確認

jQueryの日本語リファレンス
http://js.studio-kingdom.com/

jQueryのイージングプラグインの動きまとめ
http://easings.net/ja

CSS3でアニメーション!transitionとanimationまとめ(サンプル付き)
http://www.flapism.jp/html/416/

ベンダープレフィックスの扱い

ベンダープレフィックスの整理整頓
https://w3g.jp/blog/vendor_prefix_cleaning

ベンダープレフィックスの順序
http://kojika17.com/2013/02/ordering-vender-prefix.html

Androidの限界

@keyframesとAndroid(CSS3のアニメーションのバグのまとめ)
http://blog.webcreativepark.net/2012/02/12-141313.html

Android2.3ではCSS3でイージングは使えないみたい。
回転軸の指定とかも難しいかも。
あと、Android2.3ではメモリの限界?で、同一画面内で複数箇所以上アニメーションさせると動かなくなりました。
どの要素をアニメーションさせるか取捨選択は必要ですね。

投稿者:

ayako0802

フロントエンドエンジニア