3

DIV 内に iframe ページがあり、iframe ページが読み込まれて利用可能になったときにのみ DIV を表示したい。iframe ページが読み込まれない/使用できない場合は、その DIV をまったく表示しないでください。

いくつかの JS を作成しましたが、期待どおりに動作しません。iframe ページが使用可能かどうかに関係なく、DIV は引き続き表示されます。

コード：

<div class="ad-container" style="display:none">
   <iframe src="//oonagi.org" border="0" scrolling="no" allowtransparency="true" width="500" height="300"></iframe>
</div>

var adContainer = $('.ad-container');
// check if ad container exist
if(adContainer.length > 0) {
  // only show ad once iframe page is loaded
  adContainer.find('iframe').load(function() {
    adContainer.css('display', 'block');
  });
}
4

1 に答える 1

0

document.readyiframe ロードのイベントを発生させるには、iframe src を変更する必要があります。これを試すことができます。

$(document).ready(function() {

    $('#frame').bind('load', function() { //binds the event
        $('#ad-container').show();
    });

    var newSrc = $('#frame').attr('src') + '?c=' + Math.random(); //force new URL
    $('#frame').attr('src', newSrc); //changing the src triggers the load event

});
于 2013-02-28T05:31:46.673 に答える