内容单击“发布”

Question

我有一个网站，并以以下方式使用fancybox：

    $(document).ready(function() {
    // Fancybox
    $("#lightbox").fancybox({
        closeBtn : false,
    });
}); 

function openLightBox(){
    $('#lightbox').click();
}

我已经将lightbox设置为隐藏在css中，当我单击菜单项时，它将打开lightbox登录

fancybox打开得很好，但是当我试图单击块中的内容时，它的行为很奇怪，并触发了另一个单击事件。您可以看到访问以下链接的问题，然后单击底部菜单项'Secure‘，然后单击lightbox内容中的某个位置。

有人能告诉我怎么解决这个问题吗？谢谢

Answer 1

在您的站点上，您正在使用以下命令调用fancybox：

<li><a href="javascript:void(0);" onclick="openLightBox();">Secure Login</a></li>

它链接到一个名为openLightBox()的函数：

function openLightBox(){
    $('#lightbox').click();

你还用：

$(document).ready(function() {
    // Fancybox
    $("#lightbox").fancybox({
        closeBtn : false,
    });
}); 

这些都是不必要的。在第一个<li>中，您所需要的只是一个id，并使用href链接到<div id="lightbox">，然后您可以使用它调用fancybox：

<li><a href="#lightbox" id="linky">Secure Login</a></li>

然后，您所需要做的就是设置fancybox来处理这个id：

$("#linky").fancybox();

您可以在上面放置您想要使用的任何设置，例如：

$("#linky").fancybox({
    'width' : '90%',
    'height' : '90%'

})；

这就是你把代码移除关闭按钮的地方。

使用代码片段(我没有隐藏lightbox，但您所做的方式与以前一样:在CSS中)可以看到这个小提琴。