iOS中的元素奇怪重疊（PhoneGap）

我正在開發iOS/PhoneGap項目。我在iOS的一個奇怪的重疊問題（截圖來自新iPad）：iOS中的元素奇怪重疊（PhoneGap）

Screenshot from iOS

「選擇狀態」酥料餅是position: absolute, z-index: 35。該網站鏈接沒有指定位置（所以static）並且沒有指定z-index。

無論地址鏈接是不是鏈接的隨機文本，還是鏈接（如捕獲的），都會發生。

下面是它看起來像在Chrome（預期）（視網膜Mac上採取的，所以它是巨大的）：

Picture is correct is Chrome

我曾嘗試調整Z-index值整天在Safari的在iPad上的控制檯不起作用。 它似乎不是一個「簡單」的Z指數問題。所以請不要只說「調整z-index」。

[編輯]具體而言，我已經嘗試設置酥料餅的z-index到5000和網絡地址-10（給它幾個不同position S）和我已檢查這兩個元素的所有祖先做當然他們沒有z-index es（他們沒有）。我甚至嘗試給一些彈出的position s和z-index es的祖先。沒有任何改變。（又恐怕是長大了，我也嘗試改變color S和東西，只是爲了確保我的變化爲能夠進入頁面。）

感謝。

來源

2013-04-04 CWSpear

有沒有我們可以來看看實際的源代碼的方法嗎？ – kernelpanic 2013-04-04 17:46:24

原諒我，但既然你沒有指定你嘗試過負值，我建議嘗試將地址鏈接的位置設置爲絕對值，並將z-index設置爲負值。 – codeqi 2013-04-04 17:48:30

目前它沒有公開任何內容，即使我公開它也是密碼保護的......此外，我必須爲您提供實際的應用程序，以便重現實際問題，這將會非常複雜，感謝Apple的配置政策！ – CWSpear 2013-04-04 17:48:36

所以這一直困擾我們的項目約一個月，但我想我解決了它。我還沒有徹底檢驗過這個理論，但它迄今爲止解決了我們所有的問題。

如果你還記得，早在IE7的日子裏，出現了一個奇怪的z-index的bug，你可以解決它的唯一辦法是找到那名兄弟姐妹違規元素的祖先和調整他們 Z-索引。

例如，讓我們說這是我的標記：

<div class="container"> 
    <div class="header"> 
     <button> 
      Click Me 

      <div class="dropdown"> 
       <ul> 
        <li>This</li> 
        ... 
       </ul> 
      </div> 
     </button> 
    </div> 

    <div class="content"> 
     <div class="col1">...</div> 
     <div class="col2">...</div> 
     <div class="col3">www.example.com</div> 
    </div> 
</div>

，並喜歡在我的圖片，它看起來在Chrome中是正確的，但在iOS上，www.example.com高於.dropdown。

他們的兄弟姐妹是.header和.content。如果我將的z-index（當然，將position設置爲relative，當然）調整爲高於.content，則修復了問題。

希望是有道理的，並幫助任何可能來到這個網頁...

來源

2013-05-09 22:39:12 CWSpear

這太神奇了，謝謝！對於其他人：設置'.header {z-index：2; }'和'.content {z-index：1;在上面的例子中。 – Znarkus 2013-06-28 09:06:54

是的，那正是我想說的，哈哈......我猜可能會更直接。我只是很迷惑，這讓人想起糟糕的IE7時代。 – CWSpear 2013-06-28 17:09:22

謝謝，有同樣的問題！這固定它！ – Frej 2013-07-12 08:36:50

iOS中的元素奇怪重疊（PhoneGap）

回答

相關問題