株式会社カラフルクローバー公式ブログ

WordPress・HTML・CSS等のTipsを公開しています! 株式会社カラフルクローバー公式ブログ

広告の企画制作の株式会社カラフルクローバー 公式サイトはこちら

*

内部リンクのスクロール位置をずらす方法

   

現在、ヘッダー部分等、position: fixed;にて固定したレイアウトの場合がよくあります。
その場合、内部リンクがあると、ヘッダー部分の縦幅分、スクロール位置を調整する必要が出てきます。

ネガティブマージン(negative margin)を使って調整をする方法もありますが、
レイアウトにもよりますが、ネガティブマージンを設定してしまうと、
レイアウトが崩れてしまうケースがあります。

今回は、スムースにスクロールする際によく使われるjQueryのスクロール位置の調整方法をご紹介します。

(※300px下にずらした場合の記述です。)

 - CSS

  • このエントリーをはてなブックマークに追加

Message

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

  関連記事

必殺!手裏剣スクロール
Google Maps 無限スクロール地獄からの脱出方法

そこを行く読者のアナタ,スマホで何を検索することが多いですか? 私は,よく食べ物 …

文字サイズの調整無効
iPhoneやAndroidのブラウザーによる文字サイズの自動調整を無効にする方法

iPhoneやAndroidのブラウザーによる文字サイズの自動調整を無効にする方 …

画像の下に隙間が出来るときは、img要素にvertical-align: bottom;を指定で解決!

画像の下に隙間が出来て困ったことはありませんか? コーディング初心者なら一度は悩 …

Googleアナリティクスは実践あるのみ。

みなさんこんばんわ 本日学習したのは  googleアナリティクスの試験勉強。 …