1

ファンシーボックスのコンテンツに以下のコードがあります。別の派手なボックス iframe を呼び出すリンクがあります。2 ページ目の幅と高さは、最初の iframe ページとは異なります。だから私は、2ページ目に次のコードを使用して、ファンシーボックスのiframeのサイズを変更します。

   jQuery(function(){
                        //jQuery('div[id^=fancybox]').remove();
                        jQuery('#fancybox-frame', window.parent.document).load(function() { 
                            parent_fb_resize(560,444);            
                            jQuery('#fancybox-wrap').css('margin','auto');                    
                        });                            
});

以下のコードを使用して iframe のサイズを変更し、

function parent_fb_resize(w, h) {  
  if (w > 0 || h > 0) {

    if (w > 0) jQuery('div#fancybox-wrap', window.parent.document).css({ width: (w)+"px"});
    if (h > 0) jQuery('div#fancybox-wrap', window.parent.document).css({ height: (h)+"px"});
    if (w > 0) jQuery('#fancybox-content', window.parent.document).css({ width: w+"px"});
    if (h > 0) jQuery('#fancybox-content', window.parent.document).css({ height: h+"px"});
    jQuery.fancybox.resize();
    jQuery.fancybox.center();

  }
}
function fb_close_any() {
  window.top.eval('jQuery.fancybox.close()');
}

function fb_resize_any(w, h) {
  w = (w > 0) ? w : 0;
  h = (h > 0) ? h : 0;
  window.top.eval('fb_resize('+w+','+h+')');
}

ここまでは順調ですね。このコードは、2 ページ目のサイズを変更します。しかし、サイズ変更されたファンシー ボックスは、 idのプロパティが残っているため、中央の位置にありません。 fancybox-wrap 

{
display: block;
height: 444px;
left: 271px;
margin: 0 auto;
top: 20px;
width: 560px;
}

ここでは、ページの中央を見つけて、左の位置を動的に適用する必要がありますjQuery('#fancybox-frame', window.parent.document).load()。これについてアドバイスをお願いします。

4

1 に答える 1

0

left: 271px;cssに偶数があるのはなぜですか? 要素をセンタリングするために必要ではありmargin: 0 auto;ません。それはあなたの問題である可能性が高いので、それを取り除くことをお勧めします。

ここに私が何を意味するかを示すための Jsfiddle があります

http://jsfiddle.net/fPqqT/

左側の css を取り除くことができない場合は、サイズ変更を行うときに 0px に設定してください。

$("#fancybox-wrap").css("left", 0);
于 2012-10-03T12:08:19.937 に答える