【发布时间】:2016-08-28 12:00:29
【问题描述】:
我正在使用 ionic 开发移动应用。该应用程序有多个加载外部页面的 iframe。 iframe 加载在 android(设备和模拟器)和浏览器上运行良好。但在 iOS 上,外部页面并未完全加载到 iframe 中。页面在页面底部被截断,详情请看截图: iOS Device Screen
我的问题是为什么会发生这种情况以及为什么它可以在 android 上运行。 以下代码-sn-p 显示了我如何添加 iframe:
page.html
<ion-view class="center" view-title="">
<ion-content>
<!-- div used to enable scrolling in the iframe on iOS -->
<div class="scroll-wrapper">
<iframe id="seats" width ="100%" height ="100%" ng-src=" {{seatPath}}" ng-onload="hideProgess()" ng-show="!loadError" ></iframe>
</div>
</ion-content>
main.css
.center .scroll-content {
display: table !important;
width: 100% !important;
height: 100% !important;
text-align: center;
}
.center .scroll {
display: table-cell !important;
vertical-align: middle !important;
}
.scroll-wrapper {
position: fixed;
right: 0;
bottom: 50px;
left: 0;
top: 0;
-webkit-overflow-scrolling: touch;
overflow-y: scroll;
}
.scroll-wrapper iframe {
height: 100% !important;
width: 100% !important;
min-height: 100% !important;
bottom: 50px !important;;
}
编辑:
我已经测试了其他网页,当我将它们加载到 iframe 中时,即使在 ios 上也可以正常工作,这可能是我要加载的网页存在错误?
【问题讨论】:
标签: ios iframe ionic-framework