ページ内移動リンク

書式

リンク元:<a href = "#URL">リンクテキスト</a>
リンク先:<a name = "URL">リンクテキスト</a>

「ページ内移動リンク」とは、クリックするとページを読み込む事なく、スムーズにページ内に移動する事です。
下記のリンクをクリックしてみて下さい。
▼ページ最下部へ
この方法を上手に使ったテンプレートを配布されているのが
浮かばれない君のタマシイを運営しているmyhurtさんです。
recent entriesのリンクをクリックするとページ内移動をスムーズに行えている事がわかります。
例えば、長い記事を書いた場合、記事上部にメニューのようなものを作り、見たい情報をワンクリックで瞬時に飛ばせる事も出来ます。
リンク元とは
リンク元:<a href = "#リンク先URL">リンクテキスト</a>
「リンク元」というのは、「クリックすると飛んでいくリンクテキスト」です。リンク先で決めたnameを指定する事により、リンク先に移動します。
リンク先とは
リンク先:<a name = "URL">リンクテキスト</a>
「リンク先」というのは、「クリックすると飛んでいくリンク先」です。
nameに、移動する場所の名前を決めます。ここで決めたnameをリンク先#の後に記述する事により、移動するようになります。
この記事の先頭で試して頂いた、ページ最下部の場合は
<a href = "#bottom">▼ページ最下部へ</a>
そしてページ最下部で
<a name = "bottom">ページ最下部</a>
とnameにbottomを指定しています。
別にbottomでなくとも、例えば"sita"としてもいいでしょう。その場合はリンク元の方は
<a href = "#sita">▼ページ最下部へ</a>になります。

ページ最下部

トップ>記事内で使うHTML講座>ページ内移動リンク

次のキーワードを検索:[HTML][FC2ユーザー]

前後の記事

最近の記事

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。