a:5:{s:8:"template";s:5222:" {{ keyword }}

";s:4:"text";s:3188:"
このスクリプトは別のドメインの情報を読み込むiframeは自動的に高さを調整できません。一般的なブラウザーのiframeの仕様はそうしたルールになっているためです。今回は、今までご紹介した楽天のスマートフォンページの制作についてまとめました。スマートフォンは狭い画面ですが、なるべくpcと同様の情報をユーザーに提供出来るように、回遊性や見やすさ・使いやすさを意識した工夫を行いましょう。ヘッダー、フッター、サイドバーが全てiframeとかは論外です。おしゃれなショップも時々見かけますが、それらも楽天のシステム上の制約をかいくぐって表現しています。今回はiframe等を使わずに横幅100%のデザインを表現したいときに使える裏技です。 2016年5月27日追記：ある条件において高さが自動調整されずに余白が残る場合があるようです。そんなときは是非試してみてください！（コメントいただいたe3961さん、ありがとうございます！）症状 javascript - 楽天 - iframe 高さ自動調整レスポンシブ ... 私はこのコードを使って、ページにロードされたときに、すべてのiframeの高さを自動高さ（クラスautoHeight）にしています。テスト済みで、IE、FF、Chrome、Safari、Operaで動作します。
iframeをスマホ表示させた場合は横幅が100%で表示させる前提でお話していきます。「横幅が100%だった場合に、縦の高さは何パーセントになるか？」という部分を計算します。 iframe で読み込んだ子ページの高さが動的に変わる場合、読み込み元の html に固定サイズで height 属性を設定するのは望ましくありません。サイズ設定が大きすぎると余白ができるし、小さすぎると縦スクロールバーが表示されます。ページ内の一部に縦スクロールバーが表示される … iframeを使っているページなどで、iframeの高さを判別して自動的に調整したい。そんなときのJavaScriptです。jQueryを使用する方法と、jQueryを使用しない方法の2通りの設定方法を解説します。cssなどでもできますが、

サンプル：iframeの高さを自動調整するデモ. ★同じドメインのiframeの高さだけが調整できます. スマホやタブレットの画面サイズに合わせて