Home > Latest topics

Latest topics > 一部の疑似クラスと疑似要素に対応したよ

宣伝。日経LinuxにてLinuxの基礎?を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能! シス管系女子って何!? - 「シス管系女子」特設サイト

一部の疑似クラスと疑似要素に対応したよ - Jul 29, 2007

テキストシャドウを地道に改良し続けている。

  • 一部の疑似要素と疑似クラスに対応
  • インラインで折り返された文字列に対する影の描画を改善
  • 影の表示をSafariの表示に近くなるように調整
  • Firefox 3でも動くようにした

Geckoもtext-shadowに対応してくれ!というバグにこれを貼り付けて煽ってみようかと思ったら、貼られていたテストケースで::first-line疑似要素が使われてて表示できなくてこりゃまずいと思ったんで、元々対応する気の無かった疑似要素と疑似クラスにまで頑張って対応してみた。疑似クラスについてはGeckoすら対応してない物にまで対応してたりして。

考えてみたら、この拡張機能を作る事ができたのは色々な巡り合わせがあってのことなんだなあ。

  • XUL/MigemoにSafari風ハイライトの機能を取り込むに当たってDeaR氏が書かれたuserChrome.js用スクリプトを見て、position:relativeを使えば元のレンダリング結果を壊さずにインライン要素のz-indexをいじれる事を知った(それまで気付いてなかった)。
  • よりSafariに近いハイライト(ヒットした箇所がボヨヨンと動く)を実現したくて、しかしインライン要素のボックスの情報を元に単に新しいボックスを作って上に重ねただけだと単語が途中で改行されていた時に表示がおかしくなるという問題に頭を悩ませ、本家本元のSafariはどうなってるのかなと思って試してみたら同じ問題が起こって「なんだ頑張らなくてもいいんじゃん」と脱力した。でもこの時、実現の方法を模索して色々なやり方を思考実験はしていた。
  • 須藤さんがrcairoに加えた独自拡張(疑似ぼかし機能)のアルゴリズムを目の前で見せてくれたことがあった。
  • selector.jsという、MITライセンスで気軽に使える素敵なライブラリを見つける事ができた。
  • Firefox 3にtext-shadowが入らず、Firefox 4が出る(のか?)までの間ずっとそっち方面のサポートは進まないことが、ほぼ確定となり、このままじゃ僕が私生活も仕事もズッポシ依存しきっているFirefoxが他のモダンブラウザ(IE7、Opera、Safari)から大きく引き離されちまうじゃあないか! という恐怖感が増した。

技術的な蓄積と強い動機が両方揃うと、ここまでできてしまうのか、と我ながら驚いた。

分類:Mozilla > 拡張機能 > textshadow, , , , , , , , , , 時刻:11:59 | Comments/Trackbacks (2) | Edit

Comments/Trackbacks

CSS SelectorをXPathに変換したほうが早い

selector.jsをどうやって使ってるかは分かりませんが、CSS Selectorで要素を選択する場合、CSS SelectorをXPathに変換してXPathで要素を取得するほうが早いみたいです。

もしかするとhttp://dean.edwards.name/weblog/2006/03/faster/の辺り参考になるかもしれません。

Commented by にゃるら、 at 2007/07/29 (Sun) 15:56:17

情報ありがとうございます

selector.jsの成果にただ乗りさせていただいてて恐縮です。

理屈の上では確かにXPathの方が圧倒的に速い(実際、selector.js由来のコードの改造やその他の部分ではXPath使ってますし)のは分かってはいるんですが、セレクタからXPathへの変換の方法を考えるのがめんどくさかったので、それには挑戦しませんでした。
紹介していただいたページからリンクされてるスクリプトを見てみましたが、疑似クラスは豪快に無視する使用になっててショボーン……

誰か完璧なCSSセレクタ→XPathの変換器を作ってくれないかなあ(他力本願)

Commented by Piro at 2007/07/29 (Sun) 16:45:23

TrackBack ping me at


の末尾に2020年11月30日時点の日本の首相のファミリーネーム(ローマ字で回答)を繋げて下さい。例えば「noda」なら、「2007-07-29_pseud.trackbacknoda」です。これは機械的なトラックバックスパムを防止するための措置です。

Post a comment

writeback message: Ready to post a comment.

2020年11月30日時点の日本の首相のファミリーネーム(ひらがなで回答)

Powered by blosxom 2.0 + starter kit
Home

カテゴリ一覧

過去の記事

1999.2~2005.8

最近のコメント

最近のつぶやき