用語注記テンプレート(7)

このテンプレートは、本文の欄外に用語の注釈を表示するというものです。Mozilla, FireFox, Netscape Browser 8, Opera 6 等において、本文をスクロールしても常に同じ位置で注釈を参照できます。長い文章の途中でも、表示位置は崩れません。ただし、IE 6 ではうまく表示できません。
このサンプルでは次の操作ができます。
  • 下の「用語1」「用語2」をクリックすると、その注記が左の欄外に表示されます。再度クリックすると注記は消えます。

     用語1
     用語2

  • 下の「用語3」の上をマウスが通過すると、その注記が左の欄外に表示されます。再度通過すると注記は消えます。

     用語3

  • どちらか好きな方法でリンクを統一すると使いやすいでしょう。本文がスクロールしても、注記の表示位置は変わりません。また、リンクは枠線で囲み、色をつけてありますが、これらはスタイルシートの「a」タグや「a:hover」の指定を変えることによって変更できます。
    また、これは同じ操作を繰り返すまで表示は画面に残っているので、必要な注記だけを画面からコピーして転記することも簡単です。
このテンプレートのよいところは、フレームを使っているわけではないので、1つのファイルで用が足りるところです。また、構造やスタイルが全体にあっさりとしていて、入力するのも簡単に思えます。
 注記の書き方は、このファイルの中に説明しています。項目名や枠の大きさ、色など適宜変更して使ってください。(ただし、動作に関わる部分を改変して、その結果不具合が起きたとしても〔そんなことは恐らく無いでしょうが〕責任は負いかねます。)
(2005.8)
ここに説明1が入ります。
改行は<br>で行います。文章の長さをあまり気にすることなく入力できるのが、このテンプレートの最もよいところです。
ここに説明2が入ります。
掃除用具
画像を入れることも簡単です。
ここに説明3が入ります。本文がスクロールしても、注釈の位置は固定して表示されます。JavaScriptで他のファイルのDIVを参照できるかどうかを知りませんが、注釈だけ別ファイルにまとめることができたら、非常に便利だと思います。