Android jQuery淡入淡出行爲

我正在開發iphone和android的phonegap應用程序。Android jQuery淡入淡出行爲

我有一個黑色的覆蓋圖，當用戶點擊一個按鈕時顯示一個加載消息。

ios上的一切都很好，但在android上，fadeIn（）函數只顯示疊加層的一部分。真的，部分。有時只是底部，有時是底部和右上角...真的很奇怪。

雖然如果我使用.show（）代替，一切都會正確。

你見過這樣的事嗎？（可怕的質量，但你可以看到底部的一半覆蓋，並覆蓋上的右上角半透明片。）

enter image description here

什麼是錯與Android上的.fadeIn（）函數？

（這裏是如果你需要它的CSS）

.black-overlay { 
    position: absolute; 
    width: 100%; 
    height: 120%; 
    background-color: #000; 
    color: #FFF; 
    display: none; 
    z-index: 99999; 
    top:0; 
}

和HTML代碼的開頭：

<body class="side"> 
     <div class="black-overlay row-fluid"> //overlay 
      <div class="span12 loading-splash"> 
       <div class="span12"><span>Chargement...</span></div> 
       <div class="span12 span-no-margin"><img src="img/ajax-loader_black.gif" alt=""></div> 
      </div> 
     </div> 
     <div class="app container-fluid event-creation"> //Rest of the app...

來源

2013-05-10 Romain Braun

不知道它會有多大的幫助，但你有可能發佈截圖？ – 2013-05-10 15:52:36

@NirvanaTikku不知道如果我可以截圖我的android應用程序！ – 2013-05-10 15:56:23

@NirvanaTikku所以我拍了一張我的手機照片：D – 2013-05-10 16:00:31

下面是一些CSS，我使用的背景覆蓋。

.ajax-loader-background 
{ 
    background-color: rgba(0,0,0,0.2); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#30000000,endColorstr=#30000000); 
    zoom: 1; /* Force hasLayout in IE. */ 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    right: 0px; 
    bottom: 0px; 

    z-index: 99999; 
}

我不知道爲什麼你得到不同的結果和.fadeIn，除了jQuery的可能需要知道元素的寬度/高度，如果它是不可見它具有零寬度/高度。

我注意到width: 100%和left: 0px; right: 0px之間的細微差異。與height: 100%一樣。你也將高度設置爲120%，這是我從未見過的絕對定位。你不應該爲覆蓋層做這件事。

來源

2013-05-10 16:14:24 cgTag

我知道'height：120％'有點奇怪，但是我在iOS狀態欄上遇到了一些麻煩，我不得不快速修復以覆蓋整個屏幕。 '高度：100％'我在屏幕底部有一個空白區域。 – 2013-05-10 16:16:31

如果您必須覆蓋整個屏幕，請嘗試使用'position：fixed'。 – cgTag 2013-05-10 16:19:36

你也可以去'top：-1000px;底部：-1000像素;'如果你需要過度做。 – cgTag 2013-05-10 16:21:27

Android jQuery淡入淡出行爲

回答

相關問題