時空のよろず屋◆トップ＞JScript＞アンカーリスト

CGI

アンカーリストとは何か

←これ！ちなみにアンカーリストというのは私の造語である。

このホームページでも以前はかなりの回数使用されていたが、要するに、リンクの一覧表を表示するための物である。ただリンク一覧を表示するだけならいくらでも方法はあるが、人間の性なのかたかだかリンク一覧でも懲りたくなるものなのである。そう、ホームページ制作者の大多数はこう思うだろう。
「リンクの所にマウスが来たら、字の大きさ・色を変えたい。」と。
このアンカーリストを使えば簡単にそれが実現出来るのである。一度使ってみてはどうだろうか。

使い方

アンカーリストが使用したいファイルと同じ場所にあるイメージまずは下の“ダウンロード”からファイルを取得してください。続いて、“anchorlist（もしくはanchorlist.js）”をアンカーリストを使用するファイルと同じフォルダに移動します。つまり左の図の様な状態にします。

※同じフォルダに置いておかないと使用できないわけではありません。 “相対パス”を正確に指定することで使用することができます。

次にアンカーリストを使用するファイルの編集を行います。下のHTMLを見てください。

<HTML>
<HEAD>
<SCRIPT type="text/javascript" src="anchorlist.js"></SCRIPT>
<TITLE>アンカーリストサンプル</TITLE>
</HEAD>
<BODY>
<SCRIPT language="Javascript" type="text/Javascript">

</SCRIPT>
</BODY>
</HTML>
青色の字がアンカーリストの動作用に書かれています。青色の字は２つの固まりに分かれています。１つ目が“<HEAD>～</HEAD>”の中に記述されている１行。これは「ダウンロードしてきた“anchorlist”に書かれている事を使用しますよ」という意味であり、 “<HEAD>”より後ろ、“</HEAD>”より前ならどこに記述していただいても構いませんし、文章を変える必要もありません。

２つ目が“<BODY>～</BODY>”の中に記述されている10行です。この10行のうち始めの３行と終わりの３行は常に同じ文章を使用します。つまり“List(…);”の４行が使用する方々によって書き換える部分になります。

ダウンロード

anchorlist.zip
anchorlist.exe
両方とも同じファイルが圧縮されています。

“anchorlist.exe”をクリックし、
“実行(R)”を押してください。
“セキュリティの警告”画面が表示されると思います。自己判断の上、“実行する(R)”を押してください。
“展開先フォルダの選択”が表示されます。最上段にある“デスクトップ”を選択し、“OK”を押してください。
これで“デスクトップ”に“anchorlist”のフォルダができ、その中にファイルがあります。

リファレンス

AnchorList(); 初期設定・記憶領域確保: 重要度：必要
初期値：なし
アンカーリストを今から使いますと言うことをパソコンに知らせる。
WriteAnchorList(); HTMLへの書き込み: 重要度：必要
初期値：なし
アンカーリストの設定を終了し、ウェブブラウザに表示させます。
List(caption, address, target); リスト設定「表示文字(\nチップヘルプ)(・ＵＲＬ(・ターゲット))」: 重要度：適切・多重設定可
初期値：なし
caption：リンク一覧に表示される文字を設定します。また“\n”以降の文字はチップヘルプに表示されます。
address：移動したいファイルへのURLを設定します。AタグのHREFオプションと同様。またこれ以降を省略するとタイトルとして扱われます。
target：省略可能。移動させたいフレームの名前を設定します。AタグのTARGETオプションと同様。
WidthSet(width); 横幅の設定「幅」: 重要度：不要
初期値：WidthSet(0%);
width：幅を設定します。使用できる単位はスタイルシート互換です。0%の場合は横幅一杯に表示されます。
BorderStyleSet(bdc); 枠色の設定「枠色」: 重要度：不要
初期値：BorderStyleSet("black");
bdc：枠の色を設定します。色指定はスタイルシート互換です。
LineStyleSet(size, color, BGcolor, style); 通常時のスタイルを設定「サイズ・色・背景色・スタイル」: 重要度：不要
初期値：LineStyleSet("medium", "black", "white", "normal");
size：文字のサイズを設定します。スタイルシートfont-size互換。
color：文字の色を設定します。スタイルシートcolor互換。
BGcolor：文字部の背景色を設定します。スタイルシートbackground-color互換。
style：文字を傾斜させるかを設定します。スタイルシートfont-style互換。
マウスが文字の上に乗っていないときの状態を設定します。
onLineStyleSet(size, color, BGcolor, style); ポイント時のスタイルを設定「サイズ・色・背景色・スタイル」: 重要度：不要
初期値：onLineStyleSet("medium", "red", "#ffff99", "italic");
LineStyleSetと同様
マウスが文字の上に乗っているときの状態を設定します。
TitleStyleSet(size, color, BGcolor, style); タイトルのスタイルを設定「サイズ・色・背景色・スタイル」: 重要度：不要
初期値：TitleStyleSet("80%", "white", "navy", "italic");
LineStyleSetと同様
Listのaddressとtargetが省略され、タイトルとして扱われている欄の設定をします。
DisplayStyleSet(ds); 全体に適用されるスタイルを設定: 重要度：不要
初期値：DisplayStyleSet("display:block; width:100%; text-decoration:none;");
ds：全体の表示状態を設定します。スタイルシートに乗っ取って設定してください。
リンク文字独特の下線を表示したい場合はtext-decoration:none;を書かないで設定して下さい。またdisplay:block;とwidth:100%;の両方を設定されないと動作が怪しくなります。
IndexSet(highlightindex); 選択リスト番号の設定「リスト番号」: 重要度：不要
初期値：IndexReset();（下記参照）
highlightindex：ハイライト表示する場所を指定する。最上欄が“0”、２欄目が“1”。タイトルの欄も設定することが出来ますが、無視されます。、
通常やポインタ時とは異なる、注目して欲しい欄の場所を設定します。
IndexReset(); 選択リスト番号の非選択化: 重要度：不要
初期値：IndexReset();
すべての欄をハイライト表示しないようにする。しかし、IndexSetを記述しなければ、良いだけの話でこの命令を使う必要性はない。
hlLineStyleSet(size, color, BGcolor, style); ハイライト通常時のスタイルを設定「サイズ・色・背景色・スタイル」: 重要度：不要
初期値：hlLineStyleSet("medium", "black", "aqua", "normal");
LineStyleSetと同様
IndexSetで設定した欄の状態を設定します。
onhlLineStyleSet(size, color, BGcolor, style); ハイライトポイント時のスタイルを設定「サイズ・色・背景色・スタイル」: 重要度：不要
初期値：onhlLineStyleSet("medium", "red", "#ffff99", "italic");
LineStyleSetと同様
IndexSetで設定した欄であり、なおかつマウスが乗っているときの状態を設定します。

使用例

制作中

更新履歴

2002/09/29 AM 1:xx Version1.0.0：取り敢えず完成。

＜戻る