タグ

2012年2月3日のブックマーク (2件)

  • SVG & CSSでアンサガのスキルパネルのようなメニューを作る

    SVGにチャレンジ! 第1回」です。第2回があるかは分かりません。 インラインSVGを使って『アンリミテッド:サガ』というゲームのスキルパネル風のメニューを作ります。 実物は「アンリミテッドサガ スキルパネル」とかで画像検索してみてください。 このスクエアさんの『アンリミテッド:サガ』というゲームがすごく好きでですね……以前からこれをウェブページとして作ってみたいと思っていたんですよ。 クリッカブルマップとかも考えましたが、あれあまり好きじゃない。 というわけでSVGでやることにしました。拡大しても綺麗ですしね! Unlimited Saga Style Panel Menu with SVG & CSS デモファイルをダウンロード 表示確認で一番期待通りに表示できたのは、Firefox 7とChrome 16 devです。 IE 9とSafari 5.1は、transitionしません

    SVG & CSSでアンサガのスキルパネルのようなメニューを作る
  • SVG女子を90%軽くしたSVG軽量化テク+α #svggirl

    あいつ仕事してないで女の子のイラストばっかりいじってるぞと陰ながら言われていた喜納です。 HTML5で動くSVGアニメーション「SVG女子」がラスベガスでのマイクロソフト基調講演MIX11で公開され、 世界を(いろんな意味で)驚かしてきましたが、 ついに日、日でも公開されました! しかも日版に合わせてアニメーションも長くなっています! こっそりブラウザを英語にして見ていた人も必見です! (神風動画さんによる予告編動画!) 神風動画さんによるハイクオリティアニメーションをSVGで再現すると言う試み、 プログラムについては SVG Girlの公開と内部実装(プログラマーブログ) で担当プログラマーの吾郷が説明していますが、とにかく いかにSVGをきれいに軽くするかが最重要! SVGといえば拡大しても荒れる事の無いベクター形式で、pngよりも軽くつくれたりすることで使われていますが、 今回