2007年11月1日木曜日

 

ブラウザ表示のフォントサイズ変更を調べて、その値を表示するJavascript関数。

参考リンク
ファイルのダウンロードはページ下のThat’s it!からZIP形式

以下のスクリプトファイルを読み込んで使用。


<script type="text/javascript" src="textresizedetector.js"></script>

このスクリプトを使ったフォントサイズ変更時に実行される関数 onFontResize()初期関数 init()


function init()  {
  var iBase = TextResizeDetector.addEventListener(onFontResize,null);
  alert("The base font size = " + iBase);
}
function onFontResize(e,args) {
  var msg = "\nThe base font size in pixels: " + args[0].iBase;
  msg +="\nThe current font size in pixels: " + args[0].iSize;
  msg += "\nThe change in pixels from the last size:" + args[0].iDelta;
  alert(msg);
}
//フォントサイズを調べる要素IDを与える
TextResizeDetector.TARGET_ELEMENT_ID = 'header';
//初期関数を与える
TextResizeDetector.USER_INIT_FUNC = init;

HTMLソース。スクリプトに与えるIDを付ける。


<body id="header">
<h1>Resize me, now!</h1>
</body>

demo page

ブラウザ毎に異なるフォントのリサイズ値を指定してデザインの崩れを防げそう。ユーザには不自由だけど。

ラベル:


コメント: コメントを投稿

登録 コメントの投稿 [Atom]



この投稿へのリンク:

リンクを作成



<< ホーム

This page is powered by Blogger. Isn't yours?

登録 投稿 [Atom]

Google