レイアのサイズ( 3 )
最終更新日:

前へ 目次 次へ

 レイアの作成方法には予め HTML で <div>タグ を使用して作成しておく方法と HTML がロードされてから作成する方法とがあります。 後者の方法を採るのには色々な理由があります。

 そこで、今回は onLoad イベント後にダイナミックにレイアを作成する場合の 食えない事情です。

 onLoad後にレイアを作成するには通常以下の手続きをとります。

◆NN4 の場合
    var html='...';
    div = new Layer(w);
    div.document.open('text/html');
    div.document.write(html);
    div.document.close();
    div.moveTo(x,y);         // 必要なら
    div.resizeTo(w,h);       // 必要なら
    div.visibility='inherit';
◆IE4 の場合
    var html='<div id="d" style="position:absolute;...">...</div>';
    document.body.insertAdjacentHTML('BeforeEnd',html);
    div = document.all.d;
    div.style.visibility='inherit';

 作成するレイアのサイズが予め分かっている場合には、 NN4 ならレイア生成後に div.resizeTo()メソッドを使用し、 IE4 なら style で指定しますが、 文字列を含む場合のように予めサイズを計算できない場合は、 「レイアのサイズ(1) 」の時と同様の問題が発生します。

 この他に、ダイナミックにレイアを生成する場合に特有の問題として、 NN4 では生成するレイアの高さに制限ができる場合があります。

<div style="width:{w};height:{h};">
<img src="square.gif" width={w} height={h} border=0>
</div>
 {w},{h} は任意の数値です。

を想像してみてください。
この記述は body部に直接記述する限り、なんの問題もなく生成されます。

 問題は前述の NN4 のコードで、 HTML の出力を writeln メソッドで出力すると発生します。 writelnメソッドは出力する HTML の最後に改行コードを付けます。 出力された改行コードはブラウザの表示上にはあらわれませんが、 内部でフォントサイズの計算が行われ、 この結果として生成したレイアの高さの計算に影響がでるようです。

 具体的には、レイアの背景色を指定して resizeTo メソッドを コメントアウトすればわかりますが、 出力したイメージの下にフォントのベースラインの高さが加わります。

イメージが小さい場合には、ベースライン上に配置されるため上にも間隙ができます。 この場合には resizeTo するとイメージの下の部分、ひどい時には全部がクリッピングされ、 何も表示されない現象に出くわします。 f(^^;

ん〜。ネスケにも困ったもんだ。次回は何を題材にしようかなぁ〜

前へ 目次 次へ


Copyright(c) 1999 ShinSoftAll rights reserved.