Webフォントその後
第二水準まで拡張してみました。結構ファイルサイズが増えてしまいました。
http://akira.info/labs/webfont/level2/
文字拡張
第二水準まで拡張しました。これにより大抵の漢字は表示できるようになったと思います。その分700Kぐらいまでファイルが肥大化してしまいました(汗)
クラス対応置換
Blog系の仕組みの場合IDではなくてクラスを指定することが多かったので、特定のクラスを置換する関数を追加しました。
IE対策
行の折り返しの時にbackground-positionの動作がおかしかったので、空のspanタグを文字の後ろにつけることにしました。この結果コピーしたときとかに空白が入るのであまり好きじゃないのですが、仕方ないですね。
おかしな動作は折り返し前の座標を引きずっているようで、1列下の文字画像が表示されてしまいます。
他のブログに組み込んでみました
http://akiraneko2008.blog95.fc2.com/
下記をヘッダーテンプレートに入れています。
<link rel="stylesheet" href="http://akira.info/labs/webfont/level2/font_24.css" type="text/css" /> <script src="http://akira.info/labs/webfont/level2/webfont.js"></script> <script type="text/javascript"> <!-- setFont_class("div","aabody","font_aqua"); // --> </script>
あと、文字間を1.5から1.0にしています。その分少し読みにくくなっている可能性があります。
感想
なんでIEで一部の文字が表示されないんだろう。。。他のブラウザだと問題なく表示されるんですよね。もう少し実験が必要なようです。