奇怪的漸變在我的jQuery手機網站上的寡婦電話設備

Question

我創建了一個簡單的jQuery手機網站，當我在Windows Phone上查看本網站時，我的頁腳和我的內容之間存在奇怪的漸變。它只發生在Windows Phone上，我不知道它是如何到達那裏的。

見圖像：http://imgur.com/m3nChi7

CSS

 .ui-page 
     { 
      background-color: white; 
      height: 100%; 
     } 

     .ui-content 
     { 
      background-color: white; 
      height: 100%; 
     } 

     .ui-footer 
     { 
      position: absolute !important; 
      bottom: 0; 
      width: 100%; 
     } 

HTML例譜斑

<div data-role="page" data-theme="c" id="Diensten"> 
      <div data-role="header"> 
      <h1>Diensten</h1> 
      </div> 
      <div data-role="content"> 
      <ul> 
       <li> 
        <p> 
        Proofreading 
        </p> 
        <p> 
        Hebt u een tekst (brochure, webtekst, mailing,...) die u nog even wilt laten nalezen? Geen probleem, wij hebben proofreaders voor alle talen van de Europese Unie, het Russiche, Chinees en Japans. Wij zorgen ervoor dat uw tekst klaar is voor publicatie of verspreiding. 
        </p> 
       </li> 
       <li> 
        <p> 
        Taaladvies 
        </p> 
        <p> 
        Aangezien onze pool van vertalers en revisoren uit mensen bestaat die een taalkundige opleiding hebben genoten, zijn zij ook uitstekend geplaatst om u taaladvies te verstrekken. 
        </p> 
       </li> 
      </ul>  
      </div> 
      <div id="footer" data-role="footer"> 
      <p>&copy; No Problem</p> 
      </div> 
    </div> 

Answer 1

安裝weinre並檢查分配給HTML的一部分的類。它會幫助你找到那個班。

http://sviluppomobile.blogspot.com/2013/03/how-to-debug-windows-phone-html5-apps.html

因爲JQueryMobile分配大量的類每個元素，這些不都是：

.ui-page 
    { 
     background-color: white; 
     height: 100%; 
    } 

    .ui-content 
    { 
     background-color: white; 
     height: 100%; 
    } 

    .ui-footer 
    { 
     position: absolute !important; 
     bottom: 0; 
     width: 100%; 
    }