0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

iframe クロスドメイン 高さ調整は諦めた話

Posted at

##iframeに異なるドメイン(クロスドメイン)のコンテンツを読み込んで高さを自動調節しようと思ったら出来なかった

高さを調節する方法は検索すると出てくるのだが異なるドメイン先のiframeにもスクリプトを仕込む必要があるのでASP側ファイルを触れない案件なので諦めた。
※JavaScriptでiframeの高さを取得してみたいなことは同一ドメイン同士であれば可能のようだ。

###PCブラウザの場合
スクロールバーを出したくないので
heightを与え、iframeタグにscrolling="no"を記述した。

###スマホの場合
スクロールバーを出したくない場合は高さの可変に対応する必要がでてしまうのだが、
前述のように出来ないため、iframeのエリアをスクロールで対応する。

iPhone safariでスクロール可能とするためにiframeの親要素に下記CSSを与える

  height: 60vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?