在jQuery mobile 1.4.0中的移动设备上不滚动弹出窗口内的列表视图

Question

我有以下弹出窗口，其中包含一个列表视图，问题是当我在Android移动设备上测试它时，我无法滚动弹出窗口中的列表以显示剩余的列表元素，但它在jsfiddle上运行完美here。如何解决此问题并使列表在移动设备上滚动？请帮帮我..

<div data-role="page" >
<div data-role="header"  data-theme="b">
   Main Page
 </div>
 <div data-role="content">


 <a href="" data-rel="popup"  id="Btn1"  class="ui-btn  ui-corner-all"  data-inline="true" >Show Popup</a>

 </div>


 <div data-role="popup"  id="MyPOPUP" data-position-to="window"  data-corners="false"  data-overlay-theme="a"  data-dismissible="false"  >


 <div data-role="header"  data-theme="a"   >
<div  class="ui-btn ui-input-btn ui-btn-left ui-nodisc-icon" style="background-color:transparent!important;border:none;padding-top:0;padding-left:0;" >
    <input   type="button" id="ClosePOPUP" data-icon="delete" data-iconpos="notext" data-corners="false" /></div>
    <div style="text-align:center;float:center;padding-top:11px;" ><font  size="6px" color="white"  >Countries</font></div>
</div>

<div  id="scrollContent" class="content"  data-role="content"  style="background-color: white;">
    <ul data-role="listview" id="countriesist"   style="margin: 0 !important;" >

     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
     <li>Country</li>
   </ul>
  </div>


</div>
</div>