私のサイトのナビゲーションはコンテナの右側にフロートする必要がありますが、ページがスクロールするたびにナビゲーションは上部から350px右に移動するように固定位置にする必要があります。これは、私がposition:fixed
を適用し、ナビゲーションが右に止まってしまった後に働いた。どのように私は両方の世界(右、固定の位置)の最高を得ることができる任意のアイデア?固定位置で右に浮動ナビを移動しますか?
11
A
答えて
38
位置の使用:固定目的の場所にあなたのnav要素を取得するために/右上/下/左CSSを調整する必要があり。
例えば:
nav {
right: 0;
top: 50%;
}
又は
nav {
right: 0;
top: 0;
}
-1
方法X:
ちょうど別の区分内に必要な分割を作成します。
投稿する:fixed;幅:100%;外側のdivにプロパティ。
float:right;内側のdivにプロパティ。
float属性とpositionプロパティは2つの異なる桁に割り当てられているため、有効になります。 2つの部門の他のすべてのプロパティが同一であることを確認してください。
(HSLAコードを0.00に色の(a)は、そのアルファ値を変更し、外側のDIVを非表示にする)
関連する問題
- 1. cssを使用して固定位置で左右に浮きます
- 2. iosのキーボードが固定位置のヘッダーを移動します。
- 3. 固定トップ位置の浮動小数点
- 4. 位置を固定:固定;右:0;モバイルブラウザの画面上のエレメント
- 5. 位置:iOS5で固定入力がフォーカスされたときに移動
- 6. 親が回転または平行移動するときに「位置:固定」divが固定されない
- 7. マウスの移動時に自動スクロール位置を設定する
- 8. 位置のある子供:固定スクロール、固定:オーバーフロー:自動親
- 9. CSS:浮動小数点の右側にdivを配置します。右
- 10. iPadの浮動固定要素運動
- 11. 固定位置でのdivと浮かん
- 12. 位置:固定と余白:0自動IEで動作しません
- 13. ブラックベリーの位置:固定CSSが動作しません
- 14. iPadで固定側ナビ
- 15. 位置:Google Chromeで動作しない固定
- 16. Form.Show()はわずかにフォームの位置を移動します
- 17. 固定位置要素内で絶対位置を指定してZ-インデックスが正常に動作しない
- 18. 左浮動divの画像と右浮動divの文字との位置合わせ
- 19. プロローグで位置Aから位置Bへのキューブの移動
- 20. makeを起動し、Emacs内のショートカットでエラー位置に移動します。
- 21. イベントリスナーを削除し、ムービークリップを位置に移動します。
- 22. C#WPFで描画された円を定位置に移動
- 23. 画像を右に浮動し、IE
- 24. ページをブックマークリンク位置に移動
- 25. Monogame/XNA、スプライトをマウス位置に移動
- 26. Google Chromeのリストの位置に浮動小数点数が適用されたときに箇条書きが右に移動しました
- 27. 遅延位置を検出するメディアクエリ:固定動作
- 28. div固定位置
- 29. 固定位置は
- 30. ピクチャボックスの位置をスレッディングで移動します
[良い溶液(http://www.profilepicture.co.uk/sticky- sidebar-jquery-plugin /)と非常に単純です。 'position:absolute'と一緒に使用してください。 – Vucko
Vuckoのリンクはもう機能しません。プロジェクトはhttps://github.com/p-m-p/jQuery-Stickyboxに移動しました – Teepeemm