上部に固定メニューがある場合にページの途中にジャンプする方法

最終更新日: 公開日: 2019年07月

ページジャンプの方法

ページ内の特定の場所に飛ぶ方法は昔は a タグの name 属性を使っていたが,今は id で飛ぶ方法をとることが多い.

つまり,以前は

今は

と書けばよい.

上部固定メニューの場合は工夫が必要

ただし,このページのように上部に固定のメニューが存在する場合,上記のように書くだけではメニューに隠れてしまう.
そこで,その分だけずらす必要がある.
また,h2 などの id を使ってもよいが,それだと h2 に様々なスタイルが定義されている場合に干渉する可能性もある.
従って,汎用的に使いたい場合には

のように書くとよい.

見出しに装飾がしてあると難易度が高くなる

見出しに装飾をしてなければ,上の解説通りで大丈夫だが,装飾をしている場合は一筋縄ではいかない.このサイトもいろいろ試して動作するようにしている.

 タグ:  
 

Contact

ご質問等ありましたら,下のフォームからお願いします.

 
Apache Chrome Chrome 拡張機能 CSS Git Google HTML javascript Page Speed Insights PHP python SEO Windows WordPress Youtube z-index アナリティクス エディタ サーチコンソール サーバー管理 スライダー タグマネージャー テレワーク デザイン データベース ネットワーク フォーム ページ閲覧解析 マーケティング リッチリザルト レスポンシブ レスポンシブ対応 ログ解析 ローカル環境構築 営業 実装
contact
無料ダウンロード中!
大好評の書籍はこちら
Pagetop