jQuery Overlay:关闭当前的Overlay并打开另一个

jQuery Overlay: Closing current overlay and opening another?

本文关键字：Overlay 另一个 jQuery      更新时间：2023-09-26

请查看beta.gulfdine.com。您将看到一个"登录"链接。点击它会启动一个jQuery覆盖。

现在点击"为什么加入?"这将启动另一个覆盖层，其中有一个"立即注册"链接。点击它会打开之前的叠加。

现在问题来了。你会注意到，这两个叠加都有"曝光"选项，显示他们与屏幕的其余部分变暗。当两者都独立打开时，这可以正常工作。然而，当我从"为什么加入?"中启动注册叠加时，曝光效果没有显示。此外，点击覆盖层外也不起作用。

代码如下:

/*Overlays*/
var whyJoinOverlay = $("a.whyJoin[rel]").overlay({ expose: '#000', top: 'center', api: true });
var loginLinks = $("a.loginLinks[rel]").overlay({ expose: '#000', top: 'center', api: true });
$("a.callToAction").click(function (e) {
    e.preventDefault();
    whyJoinOverlay.close();
    loginLinks.load();
});

这是因为我做错了什么，还是这是一个bug在jQuery覆盖?

问题是fadeOut动画不被允许在新模态加载之前完成。我在文档中找了一下，找不到将回调传递给close()函数的方法，但是您需要找到一些方法来做到这一点。当这种情况发生时，您的代码将看起来像这样:

$("a.callToAction").click(function (e) {
    e.preventDefault();
    whyJoinOverlay.close(function()
    {
        loginLinks.load();
    });
});

确保close函数在load函数开始之前完成，即确保动作是同步的。就像我说的那样，你可能需要创造性地将回调传递给close函数:它可能需要一个JSON名称说明符，或者它可能需要提前定义。如果您找不到这样做的方法，这是库的限制，您可以添加或找出一种方法来替换

Jimmy对错误原因的判断似乎是正确的。

事实证明，有一个内置的值需要修改，以使这项工作，我发现在jQuery工具论坛:http://flowplayer.org/tools/forum/40/41903

修改后的代码如下所示: 
var whyJoinOverlay = $("a.whyJoin[rel]").overlay({
    top: 'center',
    api: true, 
    mask: {
        color: "#000",
        loadSpeed: 0,
        closeSpeed:0,//this is REQUIRED for the next overlay to work
        opacity: 0.9
        } 
});
var loginLinks = $("a.loginLinks[rel]").overlay({ expose: '#000', top: 'center', api: true });
/* No longer any need for the $("a.callToAction").click() function */
相关文章：