用語の説明テンプレート(6)：　画像を表示

このテンプレートでは、(1)文字のリンクをクリックすると画像を表示します。（『HTML+JavaScript+CSS 上級テクニック集』〔ナツメ社〕に基づいて作りました。）別ウィンドウを開くことなく、レイヤーを使って画像が表示できるのはとても見やすく、たとえば用語の説明について画像を含めて説明するのに便利です。用語１もちろん説明を加えず、画像だけを表示することもできます。その場合、レイヤーのサイズを縦横10ピクセルずつにするなど、小さく設定しておくと、画像の大きさに従って余計な余白はできません。
(2)リンクを再度クリックすると画像は消えます。また、この文章のように文中にリンクがあっても一応画像を適切な位置に表示することはできます。用語２ただし、「一応」といったのは、そのためにレイヤーの縦横の大きさやら、表示枠の大きさやらをいちいち個別に指定しなければならず、長文に向く表示方法ではないようだからです。用語３初めにレイヤーを固定し、ポップアップ・ウィンドウの左上の角をウィンドウの左上隅の座標から横に「left」、縦に「top」で指定します。これを個々のリンクについて適切な位置になるように数値を微調整しなければならないのは、少々面倒な作業です。それでもともかく表示できるのは面白い。（ただし、文章を訂正して長さが変わってしまったら、再度微調整をやり直さなければなりません。）　〔2005.8〕