且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何在另一个关闭后打开一个Fancybox?

更新时间:2022-12-08 16:16:11

好的,我终于开始工作了(我的第一个遇到fancybox)。似乎 callbackOnClose 在关闭时调用,而不是在关闭后调用。因此第二个fancybox在第一个完全关闭之后才能弹出。

Ok, I finally got it to work (my first encounter with fancybox). It seems that callbackOnClose is called upon closing, not after closing. Hence the second fancybox cannot pop up until after the first one closed completely.

诀窍?使用计时器延迟打开第二个。这绝不是完美的答案,如果定时器设置得太短会表现得很奇怪,如果设置得太长则不理想。 100ms适合我。这是代码。

The trick? Delay the opening of the second one by using a timer. This is by no means the perfect answer, could behave oddly if timer is set too short, and not ideal if set too long. 100ms works for me. Here's the code.

脚本:

$(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>