CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA
ICS MEDIAのトップページに掲載しているモーショングラフィック。これはCSSとHTML Canvas要素を使って作成したものです。時間経過とともに波の形状と色彩が変化し、多彩な表現を楽しめるようになっています。 本記事ではCSSとHTML Canvasの理解につながることを目標に、このモーショングラフィックの作成方法をステップ形式で解説します。サンプルのソースコードはすべてGitHubにて公開していますので、あわせて参照ください。 ▲ 完成版サンプル ステップ1. CSSでグラデーション背景の作成 サンプルを別ウインドウで開く ソースコードを確認する はじめに、時間経過で色彩が変化するグラフィックを作成しましょう。CSSで縦に長いグラデーションの背景を用意し、CSSアニメーションを使って縦方向に移動させることでグラデーションが変化する表現ができます（ステップ1のソースコード)。 #b
Modernizr.jsを使ってHTML5のクロスブラウザ問題に立ち向かう！ - Taste of Tech Topics
こんにちは！ しょこたんです。 HTML5の対応も着々と進み、開発をしてみよう！ とはいっても、なんだかんだで気になるのは、 クロスブラウザ問題。 特にIEは9にならないとHTML5の恩恵は受けられないとのこと。 せっかくHTML5のコードを書いても、 それでscriptエラー！ なんて出したら、台無しです。 今までは、そういった問題に対して、ブラウザのバージョンを調べて判断し、 遷移をかえることをやっていました。 たとえば <span class="rem"><!--[if lte IE 6.0]></span> <span class="rem"><meta http-equiv="refresh" content="0;url=./endosnipe_ie6.html" /></span> <span class="rem"><![endif]-->
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SVG / CSS３ / canvas を使った素敵なサイトまとめ - C site
