しままるの雑記帳

しままるの思ったことや考えたことをアウトプットする場。「PC/プログラミング」「写真/旅行」「科学(勉強)」「心の問題」が主なテーマ。

プログラミング

[備忘録] htmlにおけるベージ内ジャンプの方法

投稿日:2017年4月9日 更新日:

ページ内リンクのプログラム

 ブログを書いていて、とりあえず結論だけ欲しい読者に向けて、付加的説明を飛ばしてもらうよう、ページ内リンクを設置する必要がでてきました。今回はページ内リンクの備忘録です。

サンプルプログラム

ページ内リンクのプログラム
<a href=”#b3″>飛ばしたい方はこちら</a>
<a name=”b3″></a>
飛ばした先
※#b3を””で囲ってしまうと、プログラムが反応してしまうので、わざと””にしています。

プログラムの説明

a href = “” の””内に番号をつけます。番号の前には#を付しておきます。今回の番号にはb3を選定しましたが、これは任意です。飛ばした先のname=””の番号と対応させればいいのです。
このとき「飛ばしたい方はこちら」の文字列がクリックできるようになります

動作確認

ページ内リンクのプログラム
飛ばしたい方はこちら

hogehoge
hogehoge
hogehoge
hogehoge
hogehoge
hogehoge
hogehoge
hogehoge


飛ばした先

使用例

上記プログラムを使用したページがこちらです。
ベクトル解析の基本 ナブラ 発散 勾配 回転
ページリンク先の「発散、勾配、回転の定義だけを確認したい方はこちら」の部分です。

応用例

通常のリンクに番号を設置して、ページが変わった先の、指定した場所へ飛ばすこともできます。例えば、ベクトル解析の発散の説明を見てもらいたいときは
<a href=”http://shimaphoto03.com/442.html#a3″>ベクトル解析 発散の説明</a>
と書き、リンク先のページの発散の説明の前に
<a name=”a3″></a>
を設置すればよいのです。

応用例 動作確認

ベクトル解析 発散の説明

-プログラミング

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

自作PCのおススメ構成紹介

目次1 スペックの最低ライン2 予算を考える3 部品の種類4 レシピ紹介4.1 2万円~3万円4.2 5万円~6万円4.3 8万円~10万円4.4 10万円~5 まとめ おススメ自作PCレシピ紹介 な …

自作PC作成フロー(パソコン版)

このページは  しままるの雑記帳 簡単図説!自作PCを作ってみよう!http://shimaphoto03.com/program/pc-make/目次を↓のページでフローチャート …

gnuplotでハートの形を描く

目次1 ハート関数2 gnuplotで陰関数を疑似的に描く3 詳細説明4 できなかったこと gnuplotにハートの関数を入れて描画させよう 今回は、対話型グラフ描画ソフトgnuplotで「ハートの形 …

初心者向けLinux入門:ubuntuインストール直後にすべきこと

目次1 homeディレクトリ内ファイルの英語化2 ホストOSとゲストOSの調和を保つ2.1 Guest Addmitionsの設定2.2 ホストOSとゲストOSのファイル共有3 まとめ ubuntuを …

Excelマクロを利用した、看護記録の作成

目次1 作成動機2 初期状態3 常備薬のチェック4 頓服のチェック5 「良かったこと日記」を作りましょう6 寝る前に「おやすみなさい」ボタンを押す7 まとめ 私の健康チェックマクロを紹介します 今日は …