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>

我喜欢使用显示内联块并向左浮动，你可以看到;）

如何在手机屏幕中使用触摸屏滚动？

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%;
}

在phonegap iOS中使用iframe滚动

1 个答案: