-1

Squarespace テンプレートを編集していて、スティッキー ナビゲーション サイドバーを作成したいと考えています。「カスタム CSS」を入力できる Squarespace フィールドがあります。

サイドバーは既にありますが、CSS を修正して固定するにはどうすればよいですか? フォールドの下にスクロールしても表示されたままにしたい。

私のpageBodyWrapperdivは中央に配置され（自動/自動）、右側にcontentWrapperdivとdivの両方が含まれています。sidebar1Wrapper

私が試してみました

#sidebar1Wrapper 
{
   position:fixed;
}

または の左または右の値を使用しますpxが%、ウィンドウのサイズを変更するたびに、サイドバーがコンテンツから離れているか、コンテンツと重なっています。

これを防ぐにはどうすればよいですか？contentWrapperdivに対する固定位置を定義できますか?

ご協力ありがとうございました！

これが私が話しているサイトです: Last Wave Film。

4

1 に答える 1

1

残念ながら、その機能はまだ css に組み込まれていません。それはjavascriptで行われます。基本的に、JavaScript はページが の一番上までスクロールしたことを検出し、サイドバーを に設定しposition: fixedます。

jQuery ライブラリを使用するソリューションは次のとおりです: http://css-tricks.com/persistent-headers/

css を使用してサイドバーを固定すると、ブラウザ ウィンドウ内で永久に固定されます。

.sidebar1Wrapper {
   position: fixed;
   top: 20px;
   right: 40px;
}
于 2013-03-20T22:32:30.700 に答える