0

FancyBox V2 - 最初のファンシーボックス リンクをクリックすると、ボックスが間違ったサイズで読み込まれますが、存在してファンシー ボックスをもう一度クリックすると、正しいサイズで読み込まれますか??

ウェブサイトに複数のファンシーボックスがあるため、以前は正しく自動サイズ調整されていましたが、このファンシーボックスを開いて購入を実行すると、最初のクリックで正しく自動サイズ変更され、2 回目のクリックで正しく自動サイズ調整されます

これを修正するにはどうすればよいですか??

（明らかに、実際のP​​ayPal情報を架空の情報に置き換えました）

コードは以下のとおりです。

メインページ：-

<!DOCTYPE html>
<head>
    <!-- Add jQuery library -->
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <!-- Add fancyBox main JS and CSS files -->
    <script type="text/javascript" src="./source/jquery.fancybox.js"></script>
    <link rel="stylesheet" type="text/css" href="./source/jquery.fancybox.css" media="screen" />


       <script>
$(document).ready(function() {
$(".fancybox1").fancybox();
}); // ready
</script>
</head>

<body>
    <a href="Fancybox.html" class="fancybox1 fancybox.ajax">Buy</a>
</body>

</html>

ファンシーボックスのページ:

<form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr/" method="post" onsubmit="return">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="BuyAshirt@gmail.com">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="item_name" value="Great Shirt">
<input type="hidden" name="amount" value="10.00">
<table>
<td>
    <input type="hidden" name="on1" value="Name On Top">Name You Want On Top</td>
    <td>
    <input id="Top_name" nametype="text" name="os1" maxlength="200"></td>

    </td>
    <td>
<tr>
</table>
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_xpressCheckout.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
<input name= "agree" type="checkbox" id="CHKBOX_1" value="Accept Terms of Service"><span onClick="document._xclick.CHKBOX_1.checked=(! document._xclick.CHKBOX_1.checked);">I accept <a href="NotImportant.html" class="fancybox1 fancybox.ajax">terms</a></span> of service
</form>
4

4 に答える 4

0

これは、fancyboxが最初に開いたときにページのサイズを認識しておらず、不明であるため、に設定されてwidthいるためです。その後、オブジェクトのサイズはすでにキャッシュされているため、fancyboxはコンテンツを適切にレンダリングできます。height0

fancyboxのWebサイトから：

autoSize：（trueデフォルト）に設定されている場合、「インライン」、「ajax」、および「html」タイプのコンテンツの幅/高さは自動的に決定されます。寸法が設定されていない場合、予期しない結果が生じる可能性があります

Fancybox.htmlページ内、おそらく<table>またはの<form>ようなタグ内にサイズを設定することをお勧めします

<table style="width: 620px; height: 320px;"> - or -  <form style="width: 620px; height: 320px; display: block;">

最終的には、スクリプト内でこの特定のフォームの寸法を設定することをお勧めします

$(".fancybox1").fancybox({
 fitToView: false,
 width: 620,
 height: 320
});
于 2012-06-12T21:10:37.457 に答える
0

あなたの ajax レスポンスには画像が含まれており、fancyBox はそれらをプリロードしません。したがって、2 回目に開いた場合、ブラウザーは既にその画像をキャッシュしており、fancyBox は高さを正しく計算します。

于 2012-06-13T15:59:01.330 に答える