Valid CSS filter targeting Google Chrome and Safari 4 To target only webkit, which includes Google and Safari, encompass all the CSS that you want to use just to target Webkit in the following @media block: @media screen and (-webkit-min-device-pixel-ratio:0) { .myClass { background-color: #FF0000; } #myId {color: #0000FF;} p, a, li {text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4); } The rest of this
Javascriptのexpressionプロパティを使う。 * html #maxWidth { width:expression(document.body.clientWidth > 1200? “1200px” : “auto”); }
昨日のドラッグ＆ドロップでリストを並びかえるネタですが。 ドラッグ＆ドロップでリストを並びかえる - このブログは証明できない。 リスト間で項目を移動させて、リストが空になると高さが0になってしまいます。これでは、空のリストに項目を移動することができません。そこで、ulにmin-heightを指定したいわけですが、IE6だとmin-heightが使えないんですね。 ということで、IE6のバグを利用して擬似的にmin-heightを指定する方法です。 ul { min-height: 30px; height: auto !important; height: 30px; } IE6だと、!importantの行がスルーされて、その下の30pxが適用されます。しかも、中のliによってulの高さが変わってしまうバグのため、高さが30pxで固定されることはありません。これによって、min-hei
1. テーマを明確に示す。 [例えば、『MacBook Air』の初公開では「きょうは空気に何かがある」、昨年のプレゼンでは「きょう、Appleは電話を再発明する」など。プレゼンの頭で提示し、プレゼン中も何回かテーマに戻る。] 2. 情熱を見せる。 3. プレゼンの概略を示す。 [「今日は4つの事柄について話したい」など、全体の構成を簡単に前置きする] 4. 数字に意味を持たせる。 [「iPhoneがこれまで400万台売れた」と言うだけでなく、「1日平均2万台売れていることになる」と付け加える] 5. 忘れられない瞬間を演出する。 6. 視覚に訴えるスライドを用意する。 7. 1つのショーとして見せる。 8. 小さなミスやトラブルに動じない。 9. 機能ではなくメリットを売り込む。 10. 繰り返しリハーサルをする。 [Jobs氏はプレゼン前に何時間も練習しており、映像などとのマッチングも
ハイスペックなPC上でMac OS X「Leopard」を走らせる方法があるそうです。オリジナルの著者は「Hackintosh」と呼んでいます。昔、僕のトルコ人の友人が、Macのファイル互換性の無さに「Fuckintosh」と名付けて依頼の革命的な呼び名です。 Build a Hackintosh Mac for Under $800 インストール手順を以下でご紹介。Leopardへのパッチの当て方などは、BitTorrentを使うという前提で解説していません。詳細を知りたい方は、上記リンクを参照してください。 「Hackintosh」ハード構成 CPU: 2.2GHz Intel Core 2 Duo RAM: 4GB (4 x 1GB) マザーボード: ASUS P5W DH Deluxe motherboard グラフィックカード: GeForce 7300GT (Mac Proと同
使う機会は滅多に無いんだけど、知識として知ってないと困ったりしたので、取りあえず現在主流だろうブラウザのハックを自分のまとめ用に。 実際の状況を確認出来るように、デモページもご用意しました。 必要あるか分かりませんがダウンロードも出来るようにしときました。 拡張子がshtmlとかなってるので、htmlにして下さい。 ハックのデモページ デモページのファイル一式ダウンロード(zip:14kb) 主要っぽいハック Win IE6までのハック（アンダースコアハック） .hackTest01 { _background: red; } Win,Mac IE6までのハック（スターハック） * html .hackTest02 { background: red; } Win IE7用のハック *:first-child + html .hackTest03 { background: red; }
無名関数がかなり使いやすくなりました。高階関数のような記述もできます。 たとえば、これの結果は <?php function($func){ $func('Hello, Anonymous World!'); }(function(){ return function($str){ echo $str, PHP_EOL; }; }()); こうなります。 Hello, Anonymous World!激しく使えるので、英語の壁を乗り越えてphp.internalsに投げたくなってきました。 すべての変更点は以下の通りです。 同じ無名関数を返すステートメントを複数回実行できない問題を修正。 無名関数の生成はコンパイル時の1回だけなのでループ中に書いてもcreate_functionのようにメモリを浪費しない。 無名関数を直接コールできるように改良。 JavaScriptの無名関数のように使え
勢いに任せてVM・構文解析器・コア関数をハックして以下の機能を実装してみました。 無名関数リテラル (PHPの仕様上、実際は自動で名前が割り振られ、リクエスト終了まで関数は生き続ける) 角括弧による配列リテラル Callable Object php-5.2.5-rsky-071126.patch 最初のリリース。(PHP 5.2.5用パッチ) php-5.2.5-rsky-071126-2.patch 角括弧の連想配列リテラルでは => でなくコロンを使うように変更。 php-5.2.5-rsky-071127.patch 無名関数内で無名関数を定義できなかったのを修正。 php-5.2.5-rsky-071127-2.patch メモリリークを修正。 php-5.2.5-rsky-071127-3.patch ReflectionFunction::exportで落ちるのを修正。 Ze
待望の社内ツールできました！！！ 新しいカヤックのオフィスは大きな縁側。みんなが輪になって働くのはいいけれど、対面側に行くのは、ぐるっと回らなければならないので結構大変です。 ましてやそれがトイレともなると、「行ったけどすでに人が入ってたーっ」みたいなこともちょくちょく。 席に戻るに戻れず、トイレの前をうろうろ… 最近の流行はGainer？いえいえ、いかに安価に作るかというのも今回のテーマです。 なぜならシリーズ化するつもりだからです。 そこで今回は人体赤外線センサの完成品が3000円程度で売っていたため、それを使いました。 またそれをUSBに入力するために、ジャンクのキーボードをバラして使いました。 人体の発する赤外線を感知するとリレーがオンになって導通する仕組みなので、キーボードのスイッチに直結するだけで完了です。 あとはLinuxでキーが押されたかどうかを監視して、反応があればその状
as, twitterついったーの ID とメールアドレスを抜き出すよ！（追記）2008/3/9 18:00 crossdomain.xml が修正されて、抜き出せなくなったようです…。ソースはこんなの！（61行） package { import flash.display.Sprite; import flash.events.Event; import flash.text.*; import flash.net.*; [SWF(width="400", height="100", backgroundColor="#ffffff")] public class TwitterTracker extends Sprite { private var textField:TextField; public function TwitterTracker() { stage.scaleM
yamaokaです。 CSSに携わっている方なら、Holly hackを使ったことがあるかもしれません。 /* Hides from IE5-Mac \*/ * html .foo { height: 1%; } /* */ Internet Explorer（以下IE）で、レイアウトに問題のある要素に 上記のようなスタイルを指定をすると、 あら不思議、まともな表示がなされるというものです （上記のままではIE7に対応していませんが…）。 さて、どうしてレイアウトが意図したとおりに行われるようになるのでしょうか。 IEのhasLayoutプロパティ IEでは、全ての要素が 「hasLayout」という読み取り専用のプロパティを持っています。 これはそれぞれの要素がレイアウト情報（＝要素の幅・高さなどに関する属性情報）を 保持しているかどうかを示す値で、 デフォルトの状態では「hasLayo
件名の通り。といっても、英語ブログの訳文です。原文は「Trash All IE Hacks」より。間違いもあるかもしれませんが、訳文の許可をもらったので日本語訳しておきます。以下から訳文。 みんながIE6を嫌っていることをそろそろ認めようよ。僕たちのCSSのデバッグの約80％の時間がIE6のために費やされている。みんな知っていると思うけど、IE6は時代遅れだし、ひどいCSSのレンダリングエンジンを持っている。けれど、ほとんどの平均的なインターネットユーザはそのことをいまだに理解していない。だから、僕たちはそれに時間をかけないといけないし、様々なIEハックを使って、バグを埋めないといけない。そう、何かをやる時間を使ってね。 共通のIEハック 1.CSSコンディショナルコメント 特定のIEのバージョン（不適切なCSSレンダリングをする）で僕たちのサイトを動かすためには、CSSコンディショナルコ
関連リンク そろそろCSSハックの良し悪しについて考えてみる（書式編） そろそろCSSハックの良し悪しについて考えてみる（管理編） おまけ付き Re:CSS の用途をわざわざ (X)HTML に限ることはない スターハックに端を発するアレコレ スターハックに端を発するアレコレ まとめ編 Kurumaさんに再ツッコミ頂きました！ 飲み込みの悪い子でホントすみません。 おかげさまで何とか理解できました（できたはず）。 今回のエントリは、割と自分用のまとめ記事です。 文章化すると、再確認になっていいってじっちゃが言ってた。 発端 そろそろCSSハックの良し悪しについて考えてみる（書式編）にて、スターハックは書式上で良いハックか悪いハックか？ と考えた結果、より厳格な記述を目指すなら、避けた方が良いかもしれません。と記述。 ツッコミ これに対して、松澤さんとKurumaさんからそれぞれツッコミをい
関連リンク そろそろCSSハックの良し悪しについて考えてみる（書式編） そろそろCSSハックの良し悪しについて考えてみる（管理編） おまけ付き Re:CSS の用途をわざわざ (X)HTML に限ることはない スターハックに端を発するアレコレ スターハックに端を発するアレコレ まとめ編 前回のそろそろCSSハックの良し悪しについて考えてみる（書式編）では、正しい書式である事に重点を置いて考えてみました。 しかし、実際の業務、それも複数人が関わる際には、そればかりを重視してもいられないというのが実情だと思います。 そこで今回は、管理のしやすさを中心に考えてみます。 なお、今回もハックと呼ぶと違和感を感じる部分があるかもしれません。 ブラウザ実装の差異に対する技術、といった意味合いで、この記事でもハックで統一しています。 ルールセット単位で使用する まず思いつくのがセレクタに対して指定する、ル
Shunさんのブログの「そろそろCSSハックの良し悪しについて考えてみる（書式編）」というエントリを拝見して。 上記エントリ内で、各種ハックについての良し悪しの解説がされている。Shunさんの書かれている内容にはほとんど同意。 私もバリデータ信者で何がなんでもバリデータは通しておきたい。ただバリデータも完璧ではないので、意図ある部分でエラーもしくは警告が出た場合はスルーなわけだが。 で、ぶっちゃけ現在私が使ってるのは上記エントリ内で掲載されている中では、 ・media属性の利用(NN4除外) ・子セレクタの利用(モダンブラウザ向けの指定) ・!importantの利用(たまーーに) の3つくらいだったりする。 結構この3つだけで事足りると思うのだが･･･。 え?みんなもっといろいろ駆使してる?(汗) あまり古いバージョンへの考慮が不必要な案件が少ないことと、納期や予算の都合上あまりそこまで
2007-01-21T04:00:10+09:00 Microsoft Internet Explorer 7 正式版の登場で、これまで未対応だった CSS セレクタが利用できるようになりました。Windows IE7 で対応したプロパティのおさらいと、その他ブラウザでの対応状況を資料ではなく実際に試してみてまとめていた中から今回は子セレクタと隣接兄弟セレクタにしぼり、備忘録も兼ねてまとめてみます。子セレクタ、隣接兄弟セレクタの仕様は以下のとおり。 子セレクタ A>B { property: value; } 親要素 A の直下(子) にあるBにのみ装飾を行うセレクタ。 div>span { color: gray; } この場合、<div><span>not gray</span></div> はグレーの文字になりますが、<div><p><span>not gray</span></p>
ふと気になって、バックスラッシュハックでググッたら、以前書いたエントリが一番目に出てきました。 やったね！ なので調子に乗って、関連した記事を書いてみようと思います。 The・2匹目のドジョウ。 内容は、バックスラッシュハックのバックスラッシュハックたる所以でもある、バックスラッシュエスケープです。 そうです。 ウンチクです（またかよ）。 いやでも、技術を使うなら、「なぜそうなるのか」という理由は知っておいた方が良いと思うんですよね。 まず基本として、CSSにおけるバックスラッシュの効果は、『その直後の文字が持つ特殊な役割を無効にする』という物です。 サンプル CSS2 syntax and basic data typesの 4.1.3 文字及びその大小 を引用します。 プロパティや値の途中で改行 第1に，文字列内では，改行が続くバックスラッシュは無視される。すなわち，文字列は，バックス
明日、会社のCSS勉強会があるので、ネタの一つとして基礎調査。 CSS Hackを原文として、中にあるHackネタを少しずつ紹介。途中で挫折したらごめんちゃい。 はじめに The @import Hack Hide CSS from browsers :: @import 多分、最も有名なCSS Hackだと思われる@import hackです。 Netscape Navigator 4などのCSS1しか解釈出来ないブラウザ*1が@importを解釈出来ないと言うバグを突いたHackですね。 流れとしては次のようになります。 まずはレガシーブラウザ*2の為に読むのに至ってシンプルなスタイルを用意する(legacy.cssとする) 次に@import hack用のimport.cssを用意し、modernブラウザ用のスタイルを読み込ませる 実装例 head要素内で、 <link rel="s
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く