最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - when I use iframe in ion-content, the ion-content scroll is not working - Stack Overflow

programmeradmin1浏览0评论
<ion-view view-title="title">
  <ion-content scroll="true">
    <iframe src="{{link}}"></iframe>
  </ion-content>
</ion-view>

look at the code above.

as the title says,when I use a iframe in the ion-content the scroll does't work.

How to solve this problem.

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

look at the code above.

as the title says,when I use a iframe in the ion-content the scroll does't work.

How to solve this problem.

Share Improve this question edited Jan 8, 2020 at 0:32 Gabriel Diez 1,6922 gold badges18 silver badges26 bronze badges asked Jan 27, 2015 at 15:56 AaronAaron 1671 gold badge2 silver badges9 bronze badges
Add a comment  | 

4 Answers 4

Reset to default 16

Use overflow-scroll to enable scrolling

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

It's a bug on ios. I have resolved this problem. Refer to the following

Iframe scrolling iOS 8

Add the following css to the parent div of iframe

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

Exmaple:

HTML

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

SCSS

.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>

it will work scroll option is default true.no need to add specifically

发布评论

评论列表(0)

  1. 暂无评论