DIV不滾動Android 4.2

Question

正如在標題中所說，我在我的代碼中有一個div，我無法在Android 4.2（可能更低）的默認瀏覽器上滾動。

下面是HTML：

<div class="slider"> 
    <div class="slider-list"> 
     <div class="slide active-slide"> 
      <section class="content auth"> 
       <h1>Vérification de l'identité</h1> 
       <label for="authentication-0">Veuillez saisir votre date de naissance pour vous authentifier (JJ/MM/AAAA)</label> 
       <input placeholder="Champ obligatoire" type="text" id="authentication-0" name="authentication[430]" class="form-control auth-field" required="" data-map="430"> 
      </section> 
      </div> 
      <div class="slide"> 
      <section class="content hide"> 
       <h2>Bienvenue</h2> 
       <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam enim nisl, fermentum id nunc et, imperdiet blandit nisi. Integer risus sapien, placerat sit amet vestibulum ut, dictum vitae elit. Sed eu sollicitudin nisi. Vestibulum et pulvinar lacus, et ultricies purus. Integer elementum mi erat, id dignissim purus tincidunt at. In placerat tempor mi, viverra maximus purus convallis vitae. Morbi laoreet in arcu id finibus. Suspendisse potenti.</p> 
       <h2>Mode opératoire</h2> 
       <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam enim nisl, fermentum id nunc et, imperdiet blandit nisi. Integer risus sapien, placerat sit amet vestibulum ut, dictum vitae elit. Sed eu sollicitudin nisi. Vestibulum et pulvinar lacus, et ultricies purus. Integer elementum mi erat, id dignissim purus tincidunt at. In placerat tempor mi, viverra maximus purus convallis vitae. Morbi laoreet in arcu id finibus. Suspendisse potenti.</p> 
       <h2>Votre dossier</h2> 
       <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam enim nisl, fermentum id nunc et, imperdiet blandit nisi. Integer risus sapien, placerat sit amet vestibulum ut, dictum vitae elit. Sed eu sollicitudin nisi. Vestibulum et pulvinar lacus, et ultricies purus. Integer elementum mi erat, id dignissim purus tincidunt at. In placerat tempor mi, viverra maximus purus convallis vitae. Morbi laoreet in arcu id finibus. Suspendisse potenti.</p> 
      </section> 
     </div> 
    </div> 
</div> 
<div class="content-button"> 
    <button role="button" class="suivant next">Suivant</button> 
    <div style="font-size: 0" class="rs-boutons-recap"> 
     <button role="button" class="bouton-recommencer">Recommencer</button> 
     <button role="button" class="bouton-modifier"><span class="progress"></span><span class="btn-label">Modifier</span></button> 
     <button role="button" class="bouton-valider"><span class="progress"></span><span class="btn-label">Valider</span></button> 
    </div> 
</div> 

這裏是CSS：

* { 
    margin: 0; 
    box-sizing: border-box; 
    text-decoration: none; 
    outline: none; 
    border-style: none; 
} 

html, body { 
    font-size: 16px; 
    height: 100%; 
    width:100%; 
    font-family: 'Tahoma',Arial,sans-serif; 
} 

.slider{ 
    height: calc(100% - 220px); 
    position:fixed; 
    top:70px; 
}   

.slider{ 
    width: 100%; 
    overflow: auto; 
} 

.slider div.slider-list, .slider div.slider-list div.slide{ 
    height: 100%; 
    width: 100%; 
} 

.slide{ 
    display:none; 
    -webkit-overflow-scrolling: touch; 
} 

.slide.slider-active{ 
    display:block !important; 
} 

.content { 
    width: 80%; 
    margin: auto; 
    height: 100%; 
    padding:5% 10% 0 10%; 
} 

.content-button { 
    width: 80%; 
    height: 100px; 
    margin: 0 10%; 
    padding: 0; 
    text-align: right; 
    position: fixed; 
    bottom: 50px; 
    z-index:800; 
} 

我有一個JS腳本，在點擊按鈕。接下來，淡出」。主動滑「並淡入DOM中的下一個」.slide「。

但是，第二張幻燈片上的滾動在Android 4.2上不起作用（默認瀏覽器 - 按照預期使用Chrome）。

它的偉大工程在Android 4.4或以上版本，iOS和桌面（瀏覽器，IE9，FF，...）

有誰得到我缺少的是什麼什麼想法？

謝謝各位:)

Answer 1

calc 4.3不支持Android 4.3以上版本。

http://caniuse.com/#feat=calc

我有一種感覺.slider沒有設置它的高度，這意味着滾動將不會觸發。

嘗試設置一個靜態高度值來測試calc（）是否是罪魁禍首。