4

私は 2 つのファンシーボックスを持っていて、最初から 2 番目のボックスを開こうとしています (ボタンまたは最初のボックスを閉じることによって)。

<div id="firstFancybox" style="display:none">
   <p>I'm the first Fancybox!</p>
   <a id="fancyboxButton" href="#secondFancybox">Close first Fancybox</a>
</div>

<a id="hiddenLink" href="#firstFancybox"></a>

<div id="secondFancybox" style="display:none">
   <p>I'm the second Fancybox!</p>
</div>

最初の Fancybox は、ページの読み込み時にアクティブ化されています..

$(document).ready(function() {
    $("a#hiddenLink").fancybox({ 'hideOnContentClick': false, 'frameWidth': 300, 'frameHeight': 300 }).trigger('click');
    $("a#fancyboxButton").fancybox();
    });

最初のファンシーボックスが閉じているときはいつでも、2番目のファンシーボックスを開くことができるようにしたい. または..最初のボタンをクリックして2番目のものを開きます。

これはどのように達成されますか？私は残念ながら、イベントにバインドする運があまりありません。

-- リー

アップデート ：

callbackOnClose を使用すると、alert('hi') などの簡単なことを実行できますが、別の Fancybox を開くことはまだできていません。

    $(document).ready(function() {
        $("a#hiddenLink").fancybox({ 'hideOnContentClick': false, 'frameWidth': 300, 'frameHeight': 300, 
        callbackOnClose: function() { alert('hi'); } 
        }).trigger('click');
    });
4

3 に答える 3

6

わかりました、ようやく機能しました（fancyboxとの最初の出会い）。callbackOnClose閉店後ではなく、閉店時に呼び出されるようです。したがって、最初のファンシーボックスが完全に閉じられるまで、2 番目のファンシーボックスはポップアップできません。

トリック？タイマーを使用して、2 番目の開始を遅らせます。これは決して完璧な答えではなく、タイマーの設定が短すぎると奇妙な動作をする可能性があり、設定が長すぎると理想的ではありません。100ミリ秒でうまくいきます。これがコードです。

脚本： 

$(document).ready(function() {
    $("a#hiddenLink").fancybox({ 'hideOnContentClick': false, 'frameWidth': 300, 'frameHeight': 300, 
      callbackOnClose: function() { window.setTimeout('open2()',100); } 
    }).trigger('click');
});
function open2(){
    $("a#fancyboxButton").fancybox().trigger('click');
}

HTML: 

<div id="firstFancybox" style="display:none">
   <p>I'm the first Fancybox!</p>
   <a href="#" onclick="open2();">Close first Fancybox</a>
</div>
<a id="hiddenLink" href="#firstFancybox"><!--for first fancy box--></a>
<a id="fancyboxButton" href="#secondFancybox"><!--for second fancy box--></a>
于 2009-11-12T00:20:15.093 に答える
2

これは fancyBox 1.3+ 用です。@okw によって提案された timeOut トリックを最も効率的に使用するには、fancyBox のフェードアウトにかかる時間を知る必要があります。新しい onClosed 関数では、 currentOpts パラメータを使用できます。

$("a[rel='fancy1']").fancybox({
    onClosed: function(currentArray, currentIndex, currentOpts){
        setTimeout(function(){$("a[rel='fancy2']").click();},currentOpts.speedOut);
    }
});

この方法では、@okw が指摘するオーバーレイの問題は発生しません。

于 2011-10-22T16:03:56.473 に答える
0

これが私が回避策として見つけたものです、

ファンシーボックスのバージョン: 2

$("#first_fancybox_link").fancybox({        
    afterClose:function(){  
        $("#second_fancybox_link").fancybox({ 
            helpers:  {
                overlay : null
            },
            afterShow:function(){   
                $.fancybox.helpers.overlay.open({parent: $('body')});
            }
        }).trigger('click');
    }
}).trigger('click');
于 2015-05-18T06:16:22.367 に答える