Tag Search

なんだかただの告知板の様になってしまっているこのブログですが、今回もプチコンテンツの告知です。HTML canvas, CSS3, Web Fonts, SVG, JavaScript を使い、世界時計 "WebKit Clock" をつくりました。外部リソースは除き、画像ファイルを一切使わないというルールのもとやってみた。その名の通りWebKitブラウザ対応ですのでSafariかGoogle Chromeをご用意くださいませ。...

日本の伝統色250色をご紹介するサイト、"NIPPON COLORS - 日本の伝統色" をリリースいたしました。リリースと言うには少々大げさな1ページものですが、なんだかとても勉強になりました。現状 -webkit-mask と -webkit-transform: preserve-3d に対応したブラウザ、つまりSafariのみに対応した実験的なサイトです。...

一昨日、アップルが「Safari 4 Beta」を突如発表しました。IE7よりも最大30倍高速に動作するJavaScriptエンジン “Nitro” や美しくユーザビリティの高いCover Flowの搭載、Acid 3テストを初めて通過など、話題に事欠かない今最高にクールなブラウザです。 新機能も含め150個もの特徴が挙げられていますが、そんなことよりもこのSafari 4 Beta（以降Safari 4と呼ぶ）のリリースでその一端が明るみに出た、アップルが水面下で進めているかもしれない壮大な野望について語ってみる。...

IEには「条件分岐コメント(Conditional comments)」という（気持ち悪い）独自機能が実装されていて、これをつかうとIEのみに適用可能なHTMLの記述を簡単に行うことが出来ます。 しかしIEだけに適用させる場合ってどんな場合よ？と思うところですが、CSSコーディングを行う際にIEに別のCSSファイルを適用させたいときに使うのが一般的なよう。CSSハックの記述がどうにもこうにも増えすぎてしまって、こりゃ別ファイルに分けなければどうしようもない、というような場合ですね。 自分自身はと言うとプライベートでも仕事でも今までに利用した経験は無く、別ファイルに分けなければならないほど多量のハックを必要とすることがあるか？という疑問もありますが、知っておいて損はないということでメモ。...

デザインポータルサイトのStyleboost™が、ようやくリブートしました。サイト一時閉鎖中の期間が長かったこと、長かったこと。毎日見るサイトが1つ減ってさみしく思っていたところですが、これでまたちょっとだけ楽しくなります。...

Thank you for visiting my private site. Did you come from CSS Mania or CSSBloom or the others? The above figure is the map view report of my Google Analytics account. I'm glad to see many overseas visitors....

CSSコーディングを行う際、ブラウザごとの表示の違いを調整するために、ブラウザが持っている「バグ」を逆手に取って利用する方法があります。俗にCSSハックと呼ばれているもので、中には本来CSSの書き方として適切なものでないものもありますし、何よりソースが長く複雑になるのであまり使いたくない。 しかし最もシェアが高く最もバグが多いブラウザが、ご存知Internet Fucking Explorer。使いたくないと言いつつもCSSハックの利用が必須とならざるを得ないという、皮肉な現状があります。 仕事で利用する機会も多いことですので、備忘録としてまとめてみました。 厳密には「ハック」と言えないものがあるのかもしれませんが、目的としてはブラウザ間の表示を統一する為の技術、ということでご理解ください。...

CSSで上記のようなレイアウトをしたい場合に、必ずといっていいほど直面する現象について。その具体例と知っておくと便利な回避方法です。...

CSSとJavaScriptを使ったちょっとだけうれしい小技。JavaScriptによるDOM操作で特定のidに含まれる、特定の「偶数番目の」HTMLタグに、特定のクラスを適用します。上図はこのブログのアーカイブページの画面キャプチャですが、HTMLソースにいちいちクラスを割り当てなくても、このようなゼブラ柄を動的につくれるというお話です。名付けてZEBRA EFFECT。...