2012年04月18日

IE9で style.height に代入できない

業務用のイントラページなどでは、DIVタグの用いてページの一部分をスクロールバー付きウィンドウの様に表示するケースが良くある。
この際、リサイズイベントなどでスクロール領域の高さや幅の動的な変更を行うが、IE9では、正しく動作しない場合がある。

具体的には、IE8以下や他のブラウザの多くでは、

document.getElementById("divData").style.height = "500";

で問題なく動作するが、IE9ではうまく行かない。
(特にエラーとなる訳でも無く、処理が無視された様な挙動となる。)

原因は、IE9では単位の判定が厳密になった為と思われる。
単位をピクセルとして、明確に指定すれば回避でき、また、IE8以下でも弊害はない。

document.getElementById("divData").style.height = "500px";

要は、普段からちゃんと単位指定しなさいという事かと。
posted by rocknfields at 15:10| HTML, CSS, JavaScript