クロスドメインでiframeを読み込ませてついでにレスポンシブ対応もする方法
こんにちは、daimaです。 本日は異なるクロスドメインでiframeを埋め込んで なおかつ画面を拡縮しても iframeの高さが自動で調整されるように レスポンシブ対応させる方法をご紹介します。 なぜ、この記事を書いたかというと 私が仕事で作ったカラーミーのECサイトに 別ドメインで制作したWordpressのブログサイトの 新着一覧を載せるという仕様があったのですが CORS(オリジン間リソース共有)に引っかかったり iframeだとレスポンシブ時に高さが自動で変わらなかったりで 思った以上に時間を取られてしまったので この記事を書くことで少しでも 同じ問題で悩む方を減らせればと思ったためです。 それではどうぞ。 コード <iframe id="iframe_indexBlog" src="https://◯◯◯.com/newslist" frameborder="0" style=
親ページからiframe内の要素にCSSを適用させる方法
親ページからiframe内にCSSを適用させる方法を紹介します。 １．問題点 次のようなHTMLがあるとします。 index.html（親ページ） <iframe id="test" src="test.html"></iframe> test.html（iframeで呼び出すページ） <html> <head> <title>test</title> </head> <body> <p>test</p> </body> </html> で、iframe内に表示させるページのp要素にindex.htmlからcssを設定したいのですが、方法が分かりません。 ということで、親ページからiframe内の要素にCSSを適用させる方法を紹介します。 ネットで調べてみるとサンプルが色々出回っているのですが、情報が古かったり動作しないものが多かったので、このエントリーですぐに使えそうなものを作ってみまし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
