0

さて、クロムが2つの固定要素のz-indexを無視し、他の要素より遅れて欲しい要素が機能していないコードに取り組んでいます。

私はこのフィドルを作成しました:http: //jsfiddle.net/stev0205/4nbL9/は、他のプロジェクトとは独立してテストし、問題がどこにあるかを調べますが、これ(まったく同じjs、css、およびhtmlを使用)は複製されません私の問題、それは私が望むように動作します。

js は次のとおりです。

$(window).scroll(function() {

$("#topFixed").css({
    top: "0px",
    left: "0px",
    width: "100%",
    position: "fixed",
    marginTop: "0px"
});

$(".fixedCol").each(function() {
    var topLoc = $(this).parent().offset().top -             $(window).scrollTop();
    var leftLoc = $(this).parent().offset().left;
    $(this).css({
        top: topLoc,
        left: leftLoc,
        position: "fixed"
    });
});
});

問題は、プロジェクトに実装すると問題が残ることです。

このフィドルを壊すことができるものに光を当てることができる人はいますか? 「ブレーク」とは、緑色の要素を灰色のバーの後ろではなく前にスクロールさせることを意味します。

あらゆる試みと私の狂った考えを解読してくれてありがとう。

4

1 に答える 1

2

よし、みんな。最終的に自分の問題が何であるかを突き止めて修正しましたが、この未解決の質問を忘れて、誰かがこれを見つけて私と同じ問題を抱えているのではないかと思いました.

したがって、答えは「スタッキング順序」および「スタッキング コンテキスト」と呼ばれるものに関係しています。

この記事: http://philipwalton.com/articles/what-no-one-told-you-about-z-index/は、それを説明する素晴らしい仕事をしています。

記事を要約 (およびハッキング) するには: z-indexing は、(z-index) 番号によってページ上のランダムな要素をレイヤー化するだけではありません。特定のグループの要素をレイヤー化し、それらのグループは z-index に関係なく互いに積み重ねられます。具体的には、position: が static とは異なる要素、および opacity が 1 未満の要素。

私と同じように迷っている方の参考になれば幸いです！

于 2013-07-24T03:43:49.667 に答える