- 2007-11-30
- JavaScript
ずっと気になってた(ご存知の通り、IEで文字サイズの変更ができなくなってしまうため)んですが、ようやくcssを修正できました。
あわせて、全体的に文字を大きくしました。
デザイン的にはよくないかもですが、僕自身もそんなに目が良くないので。
あと、ついでに文字サイズ変更スクリプトも設置しました。
サイドバー(右上)の自作スクリプト実験に入れてあります。
(クッキーとかで状態を保存してないのであまり実用性はないですが・・・)
こういうスクリプトが書きやすいのも%指定のメリットですね。
以上です。(3日空けといてこれだけかよ!?)
[参考]
font-size指定 | d-spica
表「表示文字サイズとセイフティな%指定値対応表」のおかげで、px→%の変更が思っていたよりずっと簡単にできました。
IE7でも、pxで指定されたフォントサイズは拡大、縮小ができない。 - TRANS [hatena]
ちょっと期待してたんですが、IE7でもやはり駄目っぽい(僕はまだ6を使っていて確認できてない)です。ということでcssの変更に踏み切りました。
※ デザインが崩れているところ等があったら教えてくれるとありがたいです。
(外部リンクのアイコンが一部表示されていないのは認識しています。)
あ、一応文字サイズ変更スクリプトのソースは続きに入れておきます。
[ソース]
<div class="plugin_data">
文字サイズ変更:<br />
<a href="#" onclick="bnResizer.set(55); return false;" title="最小">min</a>|
<a href="#" onclick="bnResizer.small(); return false;" title="小さく">-</a>|
<a href="#" onclick="bnResizer.set(75); return false;" title="標準に戻す">±0</a>|
<a href="#" onclick="bnResizer.big(); return false;" title="大きく">+</a>|
<a href="#" onclick="bnResizer.set(145); return false;" title="最大">max</a>
</div>
<script type="text/javascript">
bnResizer = new function() {
this.small = function() {
var size = parseInt(document.body.style.fontSize.replace(/%/, ''));
var newSize = size - 10;
if(newSize > 50) {
document.body.style.fontSize = newSize + '%';
}
}
this.big = function() {
var size = parseInt(document.body.style.fontSize.replace(/%/, ''));
var newSize = size + 10;
if(newSize < 150) {
document.body.style.fontSize = newSize + '%';
}
}
this.set = function(size) {
document.body.style.fontSize = size + '%';
}
}
bnResizer.set(75);
</script> - Newer: iKnow!始めました
- Older: 外部cssを動的に読み込む方法
Comments:0
Trackback+Pingback:1
- TrackBack URL for this entry
- http://blog.bornneet.com/TrackBack/27/
- Listed below are links to weblogs that reference
- px指定やめました(&文字サイズ調節スクリプトも設置) from Born Neet
- Trackback from Born Neet 2008-01-19 (土) 03:24
-
ブログ用自作スクリプトをちょこっと修正
サイドバー(右上)に地味に置いてる奴です。 ずっと気になってたブログ内検索するとスクリプト内の文字列までハイライトのためにspanタグで囲まれちゃう問題(なんじゃそれ?)に対応しました。 具体的には、外部スクリプト化できるやつはbornneet.jsっていうファイルにまとめて、できないやつは無名関数化して安全圏であると思われるonclick属性に入れるように変更しました。 これで、上記の機能が原因のエラーは出なくなったと思います。(スクリプト自体の不具合はあるかもしれません) ... (more…)