簡體   English   中英

當我在離子內容中使用 iframe 時,離子內容滾動不起作用

[英]when I use iframe in ion-content, the ion-content scroll is not working

<ion-view view-title="title">
  <ion-content scroll="true">
    <iframe src="{{link}}"></iframe>
  </ion-content>
</ion-view>

看看上面的代碼。

正如標題所說,當我在離子內容中使用 iframe 時,滾動不起作用。

如何解決這個問題呢。

使用 overflow-scroll 啟用滾動

<ion-view view-title="title">
    <ion-content overflow-scroll="true">
         <iframe src="{{link}}"></iframe>
    </ion-content>
</ion-view>

這是ios的一個bug。 我已經解決了這個問題。 參考以下

iframe 滾動 iOS 8

將以下css添加到iframe的父div

-webkit-overflow-scrolling: touch !important;
overflow: scroll !important;

例子:

HTML

<ion-content class="iframe-fix">
  <iframe [src]="pageUrl" frameborder="0"></iframe>
</ion-content>

社會保障局

.platform-ios{
    .iframe-fix{
      -webkit-overflow-scrolling: touch !important;
      overflow: scroll !important;
    }
}
<ion-view title="sample page">
 <ion-content>
 <iframe src="http://www.w3schools.com">
       <p>Your browser does not support iframes.</p>
</iframe>
</ion-content>
<ion-view>

它將工作滾動選項默認為true。無需專門添加

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM