jquery - ファンシーボックス Iframe の幅を設定する方法

Question

ここのソリューションに基づいて画像をファンシーボックスiFrameに返すために、画像へのリンクをPHPファイルに渡しています

残念ながら、iframe の幅は約 850px のままですが、高さは変わります。

画像のスタイルを幅: 150px、高さ: 150px というばかげた値に設定しましたが、iframe の幅は 850px のままで、左上にサムネイル サイズの画像が表示されていました。

jfkのソリューションを組み合わせようとしましたが、ifrmeは同じ幅を差し戻しました。

画像サイズに応じて高さと幅が設定されるように iframe コードを作成するにはどうすればよいですか?

$(document).on('click', '.Images', function(e) {
e.preventDefault();
var Href = 'GetImg.php?img=' + $(this).attr("href");
$.fancybox.open({
    href: Href,
    type: 'iframe',
    padding: 5
  });
});

ありがとうホリー

Answer 1

ファンシーボックスの幅を設定できます。次のようにします。

$.fancybox.open({
    href: Href,
    width: 500,
    type: 'iframe',
    padding: 5
  });
});

Answer 2

iframe を使用しているため、子ウィンドウが親ウィンドウにネストされています。Javascript セキュリティは、親ウィンドウが iframe バリアによって分離されている場合、子ウィンドウのドキュメント オブジェクト モデルに直接アクセスすることを防ぎます。迅速な解決策は、fancybox 属性を変更して、ポップアップ ウィンドウが iframe ウィンドウではなくインライン div として扱われるようにすることです。Fancybox は、インライン ウィンドウの高さと幅のプロパティを自動的にクエリし、自動的にサイズを変更できます。

ただし、iframe を介してポップアップを実装する必要がある場合は、別のウィンドウを別のドメインからのものとして扱いたいと思うでしょう。子ウィンドウで、別のサーバーに情報を投稿する API 呼び出しと同様に動作する postMessage() を設定します。親ウィンドウで、リクエストに応答し、受信した値に基づいて動作するリスナーを設定します。postMessage() の HTML5 仕様により、2 つのウィンドウがこの方法で通信できるようになります。子ウィンドウの $(document).ready() 関数スタックに postMessage() リクエストを配置し、fancybox 呼び出しの onComplete() 関数スタックにリスナーを配置できます。

http://viget.com/extend/using-javascript-postmessage-to-talk-to-iframes

Answer 3

幅と高さのパラメータを指定しようとしましたか?

http://fancybox.net/api