<layer> - レイヤ
目次
概要
- 形式
- [非推奨]
<layer>
~</layer>
- サポート
- Netscape 4
- タグの省略
- 開始タグ:必須、終了タグ:必須
- 包含可能要素
- ブロック要素 / インライン要素
説明
layer要素は Netscape Communicator 4.0 のダイナミックHTML技術の中核としてサポートされましたが、現在ではほとんど使用されていません。
レイヤは、テキスト、画像、他の HTML 文書などを乗せたシートのようなものです。JavaScript を用いることで、レイヤの位置を変更したり、非表示にしたりなど、ダイナミックな効果を持つページを作成することができます。
JavaScript からは、document.layers["id1"]
の形式でアクセスできます。id1 は、<layer>
や <ilayer>
の name または id 属性で指定した名前です。
<ilayer>
と <layer>
の違いは、<ilayer>
がインラインで表示されるのに対し、<layer>
はその存在が無視された状態で、次のテキストが表示される点が異なります。
属性
共通属性
- グローバル属性
- 詳細は グローバル属性 を参照してください。
固有属性
- background=url
- [非推奨] N4
- 背景画像を指定します。
- bgcolor=color
- [非推奨] N4
- 背景色を指定します。
- clip=n,n,n,n
- [非推奨] N4
- このレイヤの可視部の矩形を左、上、右、下の順に "20,20,50,100" のように指定します。"50,100" と省略した場合は "0,0,50,100" と同じ意味になります。
- height=n
- [非推奨] N4
- このレイヤの高さをピクセルまたはパーセンテージで指定します。
- src=url
- [非推奨] N4
- このレイヤの中に表示する文書のURLを指定します。この属性を省略すると、<layer>~</layer>で囲まれた文書が表示されます。
- visibility=bisibility
- [非推奨] N4
- このレイヤの表示状態を指定します。
- show
- 表示する(既定値)
- hidden
- 表示しない
- inherit
- 親のレイヤに従う
- width=n
- [非推奨] N4
- このレイヤの横幅をピクセルまたはパーセンテージで指定します。
表示位置属性
- left=n
- [非推奨] N4
- このレイヤを表示する横方向の位置をページの左上隅からの絶対値(ピクセル)で指定します。
- pagex=n
- [非推奨] N4
- このレイヤを表示する横方向の位置を親のドキュメント(レイヤ)からの沿う対置(ピクセル)で指定します。
- pagey=n
- [非推奨] N4
- このレイヤを表示する縦方向の位置を親のドキュメント(レイヤ)からの沿う対置(ピクセル)で指定します。
- top=n
- [非推奨] N4
- このレイヤを表示する縦方向の位置をページの左上隅からの絶対値(ピクセル)で指定します。
重なり具合指定属性
- above=name
- [非推奨] N4
- 複数のレイヤがある場合の重なる順番を指定します。name には他のレイヤの name や id 属性の名前を指定します。above=xxx とすると、xxx レイヤがすぐ上のレイヤになります。
- below=name
- [非推奨] N4
- 複数のレイヤがある場合の重なる順番を指定します。name には他のレイヤの name や id 属性の名前を指定します。below=xxx とすると、xxx レイヤがすぐ下のレイヤになります。
- z-index=n
- [非推奨] N4
- 複数のレイヤがある場合の重なる順番を指定します。この値が大きなレイヤほど上に表示されます。
使用例
HTML
<layer bgcolor="#ff9999" top=0 left=0 width=100 height=100>AAA</layer>
<layer bgcolor="#99ff99" top=30 left=30 width=100 height=100>BBB</layer>
<layer bgcolor="#9999ff" top=60 left=60 width=100 height=100>CCC</layer>
表示
※ Netscape Communicator以外のブラウザのために、スタイルシートを用いて表現しています。
Copyright (C) 1996-2017 杜甫々
初版:1996年9月10日 最終更新:2017年12月31日
https://www.tohoho-web.com/html/layer.htm