|
１ページが縦に長い文章の場合、ページ内の特定の場所に名前をつけて
その場所へジャンプさせる方法です。
まずは サンプルをみてください。
場所を指定してリンクしてみました。
それぞれリンクをクリックすると 指定された項目まで移動してくれるのが
わかりますね。
これは あらかじめジャンプさせたい項目のところで <a name="○"> で
名前をつけています。名前は何でもいいのですが、あとで確認してきちんと
区別できるようにしておきましょう。（半角英数字で指定します。）
リンク先の指定です。 下の場合では "001"という名前をつけました。
| <a name="001">１、●●●のお話</a> |
そして リンク元の部分は <a href=#○"> でジャンプ先の名前を指定します。
このとき ジャンプさせたい項目につけた名前と リンク元の部分が一致して
いないといけません。
リンク元の指定です ここでは "001" のところまでジャンプしてください。
という指定になっています。
| <a haref="#001">１、●●●のお話</a> |
リンク元で指定した "001" の部分と
リンク先に指定してある "001" が 一致すると、
その場所までジャンプしてくれます。
つまり 複数のリンク先を作る場合は、同じ名前は指定できません。
また リンク元の部分には 必ず # が入ります。忘れないように指定しましょう。
今回は 5項目入れてありますが、 こういうページの場合 １つの項目を読み終えた
あとに メニューを使いたい場合 いちいちページ上に戻さないといけませんね。
これだとかなり不便ですので、それぞれの項目のあとに ページの上部に戻るリンクを
設定しています。 これも同じように ページのトップの部分に名前を指定して
項目ごとの終わりに ページのトップに戻るリンクを設定してあります。
これで どの項目を読んだ後でも ページのトップに戻ることができますね。
このリンクも 必ず入れておくようにしましょう。
サンプルのHTMLの構成は こんなふうになっています。
青い部分が リンク元です。
緑の部分が ジャンプ先の名前を指定しています。
だいたいの感じを理解してくださいね♪
<a name="top"><h1>場所を指定してリンクしてみました。</h1></a>
<p>
<a href="#001">１、●●●のお話</a><br>
<a href="#002">２、■■■のお話</a><br>
<a href="#003">３、▲▲▲のお話</a><br>
<a href="#004">４、★★★のお話</a><br>
<a href="#005">５、◆◆◆のお話</a>
</p>
<a name="001"><h3>１、●●●のお話</h3></a>
：
：
：
<a href="#top">このページのトップへ</a>
<a name="002"><h3>２、■■■のお話</h3></a>
：
：
：
<a href="#top">このページのトップへ</a>
<a name="003"><h3>３、▲▲▲のお話</h3></a>
：
：
：
<a href="#top">このページのトップへ</a>
：
：
：
|
|
