Ionic 4 ионный контент iframe с внешним сайтом с помощью липкого заголовка - PullRequest
1 голос
/ 14 мая 2019

Я искал и пробовал все возможные примеры Вот моя цель. У меня есть стартовый шаблон для вкладок. Каждая вкладка откроет страницу, которая будет загружать другой путь из удаленного домена (используя https) через iframe. В андроиде работает как я надеюсь. В IOS, из того, что я прочитал, iframe «height: 100%» фактически соответствует высоте содержимого в iframe, а не видимой области в приложении, поэтому фиксированный заголовок прокручивается вместе со страницей, потому что для всех он думает, что у вас действительно высокий экран. Что мне нужно сделать, это когда вы прокручиваете, фиксированный заголовок остается наверху. Вот код:

Компонент для вкладки HTML

<ion-content >
  <div class="iframe-fix">
<iframe
    [src]="myurl"
    frameborder="0"
    webkitallowfullscreen
    mozallowfullscreen
    allowfullscreen
  ></iframe>
</div>
</ion-content>

На форумах я нашел несколько хитростей, которые должны работать, и создал этот файл CSS, который я включил в index.html:

.iframe-fix iframe {
  -webkit-overflow-scrolling: touch !important;
  overflow: scroll !important;
  width: 100%;
  height: 100%;
  border: none;
  margin-top: 40px;
}

.iframe-fix {
  overflow: hidden;
  width: 100%;
  height: 100%;
  border: none;
  background-color: #fff;
}

Буду признателен за любую помощь / поддержку. Спасибо !!

...