chrome 5 beta の font-family の規定値が serif になってるのが気に入らない - 雑用系
同意する。すべてのサイトは、私の愛する、あのフォント(お好みのフォント名でご置換ください)になっているべきだ。
あと、font-weightやfont-styleをいじるサイトも気に入らない。たとえ英文であっても、読みにくくて仕方がない。
しかーし!
@font-faceで、既存のフォント名を上書きするのは気に入らない。だいたい、フォントなんて星の数ほどある。いちいち上書きしていられない。
では、ユニバーサルセレクタと!importantを使うべきか。しかし、いざという時に、簡単に有効、無効を切り替えられなければ困る。
というわけで、extensionだ。
まず、manifest.json。
{ "name": "Disable Ugly Font", "version": "1.0", "description": "Disable bold and italic", "permissions": [ "http://*/*", "https://*/*" ], "content_scripts": [ { "matches" : [ "http://*/*", "https://*/*" ], "js" : ["disable-ugly-font.js"], "all_frames" : true } ] }
次に、disable-ugly-font.jsだ。
(function() { var style = document.createElement("style") ; style.setAttribute("id", "hito-disable-ugly-style") ; style.appendChild( document.createTextNode( "* { font-face : 'メイリオ' !important ; font-weight : normal !important ; font-style : normal !important ;}" ) ) ; document.getElementsByTagName("head").item(0).appendChild(style) ; })();
最後に、無効にするブックマークレット。これは、ブックマークとして追加する。
javascript:(function(){ var style = document.getElementById("hito-disable-ugly-style") ; if ( style ) document.getElementsByTagName("head").item(0).removeChild(style) ; })() ;
あとは、このextensionを読み込めばいい。
2 comments:
Content Scriptsのデフォルトの実行タイミングは結構遅いので、適用前の状態が一瞬見えてしまうと思います。
http://code.google.com/chrome/extensions/content_scripts.html#registration
なので、"run_at": "document_start" をお薦めします。
ただ、そうするとheadがないので、setTimeoutかDOMNodeInsertedあたりを使う必要があるのが難点ですが…
あと、HTML5にはdocument.headという便利なものがあります。
ちなみに、簡単にON/OFFできる機能は、そのうちStylistに実装しようと思ってます。
たしかに、一瞬だけ、自前CSSを注入する前の状態が見えてしまいますが、
私はあまり気にしたことがありませんね。
Post a Comment