Question

我已使用“最低设置”将Overlay effect jQuery工具添加到我的网站。不幸的是，当用户想要关闭它时，他必须瞄准右上角的这个小圆圈。可用性受此影响。如果用户只需点击任意位置就可以关闭它。这将会好得多。

我是否可以修改或添加一些代码，以便无论用户点击何处都会关闭叠加层？或者也许当他点击叠加层外？我在文档中找不到任何关于它的注释。

Answer 1

或者当他在叠加层外点击时？
检查the docs（'配置'部分）：

closeOnClick （默认值：true）
默认情况下，在叠加区域外单击鼠标时会关闭叠加层。将此属性设置为false会禁止此行为，这种行为适用于模态对话框。

即，默认情况下已启用此功能。如果它不起作用，您可能希望向我们展示您的叠加配置。

Answer 2

@NikitaRybak closeOnClick仅在您使用曝光/遮罩时有效。我修改了覆盖代码，无需曝光/掩码..

整理缩小的javascript .. 在缩小的代码中找到它：

b.closeOnClick && a(document).bind("click." + n, function(l) {

并将其插入到函数中

if (!a(l.target).hasClass('overlay') && !a(l.target).hasClass('apple') && !a(l.target).parents('.overlay', f).length && !a(l.target).parents('[rel="#' + a(f).attr('id') + '"]').length && !(a(l.target).attr('rel') == '#' + a(f).attr('id'))) { c.close(l); }

现在，如果你正在使用苹果效果，请在苹果效果代码中找到它：

b = h('<img src="' + b + '"/>');

并插入class =“apple”，使其变为：

b = h('<img class="apple" src="' + b + '"/>');

希望如果有人需要它会有所帮助..

Answer 3

尝试（快速和肮脏）：

$(document).click(function(){
    $('.simple_overlay:visible .close').click();
});

Answer 4

在我的实验中，我发现即使official jQuery Tools standalone demo也未正确关闭叠加层。例如，当我点击覆盖图像下方时，它会关闭，但是当我点击覆盖图外侧的右侧或左侧时，它不会关闭。

所以，在我的情况下，我使用下一个解决方案来关闭文档上任何位置的叠加：

<script type="text/javascript">
    function closeOverlay(){
        $('.overlay:visible .close').click();
    }
    document.addEventListener('click',closeOverlay,true);
</script>

可能它也很脏，但它对我有用。

如何在点击时关闭jQuery Tools Overlay，无论在哪里？

4 个答案: