別のdivの上にdiv（z-index）があります。

Question

私は潜在的に重複する可能性のある透明なdivを持っています。それらは、明示的なCSS z-orderまたはデフォルトのDOM順序付けによって、「zオーダー」に配置することができます。 スタイル指定によれば、DOM順序付け、z-インデックスおよびdisplayスタイルの多くの組み合わせが、要素の結果的に有効なz位置にすべて影響します。

シンプルな明示的なZ-インデックスに頼るのではなく、より一般的なスタイルルールに従って、特定の参照オブジェクトの上（または下）にあるすべての要素を見つけるにはどうすればよいですか？

私の質問の焦点は、zオーダーにのみあります。 "find"とは、上/下の要素を選択または反復する（javascript/jquery）アルゴリズムを持つことを意味します。

ノート：ドキュメントを探して、私は

https://www.smashingmagazine.com/2009/09/the-z-index-css-property-a-comprehensive-look/

一つは、「レンダリングを問い合わせることができればそれがベストだろう

https://philipwalton.com/articles/what-no-one-told-you-about-z-index/

よりも読むことが少し優れていると思いますエンジン "とは何とかして - 指定されたxy位置ですべてのクリックが（その場所で）トップ要素を直接トリガしているので、情報はすでにどこかに...！？

Answer 1

これは重複している要素をすべて見つける方法ですが、私はそれらをz-indexでどのように注文するかはわかりません。あなたが言ったように、Zインデックスの順序に影響を与える多くのオプションがあります。これを行うには巨大なコードが必要です。すべての要素を数回ループする必要があるため、パフォーマンスについては不明です。

$("div").on("click", function() { 
      var div = $(this); 
      $('body').find('*').each(function() { 
       if($(this).width() > 0 && $(this).height() > 0) { 
        if((($(this).offset().left <= div.offset().left && $(this).offset().left+$(this).width() >= div.offset().left) 
         || ($(this).offset().left < div.offset().left+div.width() && $(this).offset().left > div.offset().left)) 
         && (($(this).offset().top <= div.offset().top && $(this).offset().top+$(this).height() >= div.offset().top) 
         || ($(this).offset().top < div.offset().top+div.height() && $(this).offset().top > div.offset().top) 
         )) { 
         console.log($(this)); 
        } 
       } 
      }); 
      return false; 
     });