ページを下にスクロールすると、ナビゲーションがページの上部に固定される非常に単純な効果を作成しようとしています。私がしなければならないのは、現在持っているヘッダーに「位置:固定」を設定することだけです。何らかの理由で、「位置:絶対」要素と固定要素のように扱っています。私は同じ効果を持つページの他の要素でそれを試したので、問題を引き起こしているHTMLまたはCSSコードに何かを持たなければなりません。何か案は?
http://jsfiddle.net/apautler/yDhXG/1/embedded/result/
ヘッダーCSS
.nav-main {overflow: visible; position: fixed;
top: 0; left: 0; right: 0; height: 60px; width: 100%;}
注、サイトはレスポンシブなので、position: fixed
は768pxで開始します。
現時点では、 Chromeはposition:fixed
変換下の要素 。 (コンテンツフリー)を削除します
-webkit-transform: translate3d(0, 0, 0);
そしてそれ 動作します 。