ワイズリマインダー

メニューを上部に固定している時のページ内ジャンプ

<a href="#hoge">HOGEへ移動</a>

このようなタグでページ内ジャンプをさせたい。
でも、posizion:fixedなどでページ上部にメニュー等を張り付かされていると
ジャンプさせたい箇所が微妙にメニュー等の後ろに隠れてしまう。

cssだけで対応できます

ページ上部に張り付いているメニュー等のheightが50pxの場合
html

<a name="hoge" id="hoge">HOGEですよー</a>

css

#hoge{
display:block;
margin-top:-50px;
padding-top:50px;
pointer-events:none;
}

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください