在電話中使用iframe滾動iOS

Question

如果在PhoneGap應用程序中有iframe。該框架已被賦予1000的高度。通過將其寬度調整爲50％，我可以通過觸摸框架旁邊的空間上的父項進行滾動。但是當我嘗試通過觸摸框架本身進行滾動時，沒有任何反應。

我查找了這個問題，並且報告了一些包含-webkit-overflow-scrolling：touch的解決方案的問題。但沒有運氣。

#content_wrap { 
    display: inline-block; 
    float:left; 
    width:100%; 
    overflow-x:hidden; 
    position:relative; 
    height:auto; 
    z-index:300; 
} 


#content_wrap .content_container { 
    position:absolute; 
    left:0px; 
    display:inline-block; 
    float:left; 
    width:100%; 
    padding:0; 
    min-height:100%; 
    height:auto; 
    background-color:#FFF; 
} 

#tickets { 
    display:inline-block; 
    float:left; 
    width:50%; 
    margin:0px; 
    height:auto; 
} 

#ticketFrame { 
    height:1000px; 
    display:inline-block; 
    float:left; 
    width:100%; 
} 

的HTML：

<div id="content_wrap"> 
    <div class="content_container"> 
     <div id="tickets"> 
     <iframe src="someurl" frameborder="0" id="ticketFrame"></iframe> 
     </div> 
    </div> 
</div> 

我使用內嵌式地顯示塊和左浮動就像你看到的粉絲;）

怎麼做才能夠在觸摸屏滾動PhoneGap的？

Answer 1

也許問題是你的iframe標籤？ </iframe">

如果沒有，請添加/更改您的CSS並再試一次。

html, body { 
    height: 100%; 
    min-height: 100%; 
    margin: 0; 
    padding: 0; 
} 

#content_wrap { 
    display: inline-block; 
    float:left; 
    width:100%; 
    overflow-x:hidden; 
    position:relative; 
    height:100%; 
    z-index:300; 
} 

#content_wrap .content_container { 
    position:absolute; 
    left:0px; 
    display:inline-block; 
    float:left; 
    width:100%; 
    padding:0; 
    min-height:100%; 
    height:auto; 
    background-color:#FFF; 
} 

#tickets { 
    display:inline-block; 
    float:left; 
    width:50%; 
    margin:0px; 
    height:100%; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    top: 0; 
    -webkit-overflow-scrolling: touch; 
    overflow-y: scroll; 
} 

#ticketFrame { 
    height:1000px; 
    display:inline-block; 
    float:left; 
    width:100%; 
}