JavaScriptなし!! CSSだけで実現する3Dアニメーション | HTML5GOGO
CSS3のアニメーションサンプルで、立方体を扱ったものは数あれど、それ以上の多面体のサンプルが見当たらなかったので、倍の12面体を作りました。 イメージ 概要 今回はそのサンプルを題材に、CSS3で新たに追加されたアニメーション系のプロパティをご紹介します。 ※今回ご紹介するプロパティは、執筆時点では全て要ベンダープレフィックスです。 ※対応ブラウザ：Chrome 12～, Safari 5～ Mozillaは「現時点では Z 軸はサポートされていないため 3D の回転や 3D 拡大縮小、3D 変換はサポートされていません。」だそうです。 MDN – CSS transforms の利用 ※グラフィックボードが3Dの表現に対応している必要があります。 ※動作にはCPUパワーが少々必要になります。 HTMLサンプル ※各面はリンクになっています。 回転方向を指定できるコントローラー付きのサン
ロゴをSVG化、してみました！でも・・・ | HTML5GOGO
画像で何かやってみようかな、と思いこのサイトのロゴをSVGにしてみました。 と言ってもSVGにすること自体はそんなに難しく無いです。 Adobe イラストレーターなどでSVG形式で書きだせばOKです。 問題なのは、ブラウザで表示させようとした場合でした・・・ HTMLでSVGを使う場合 そんなわけでSVGをHTMLで表示させる方法を試してみました。 方法は大きく分けて2種類。 画像と同じように扱うか、objectタグで埋め込むか、です。 というわけで早速サンプルをどうぞ。 画像として使う場合 ・そのまんま画像で ・背景画像として 結論 色々な方が様々な方法で既に試されているので結論を。 画像として扱う場合、使い勝手が良く、是非こちらで使いたい。 でもFirefoxが対応してない（.htaccessでなんとか出来るという話を聞くもうまくいかず・・・） objectタグで埋め込んだ場合表示は可
キャッシュマニフェストを設定！でも… | HTML5GOGO
キャッシュマニフェストとは HTML5の周辺技術で、以前からブラウザに実装されているブラウザキャッシュよりも、強力なローカルへのキャッシュを制御するAPI（Offline Application Caching APIs）の設定ファイルです。 http://www.w3.org/TR/offline-webapps/#offline 設定してみましょう まず、キャッシュマニフェストファイルを作ります CACHE MANIFEST # #から始まる1行はコメント # ↑先頭には必ず、「CACHE MANIFEST」 # Version: 2010121701 # ↑Versionはキャッシュの更新のために、設定しておくと楽。 CACHE: # ↑「CACHE:」以降がローカルにキャッシュする対象 # 「CACHE:」がなくても、同じ意味。 /admin/wp-content/themes/h
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
border-radiusをつかって丸を作ってみました | HTML5GOGO
