当另一个元素消失时，使一个元素消失

Question

上下文：我正在为模态（窗口弹出窗口）创建一个小的jQuery库：https://github.com/hypesystem/d_modal.js

创建新模态时，也可以淡化页面。这是通过添加具有半透明黑色背景的div来完成的。

当移除模态时，我希望“淡入淡出”也消失。但是当模态为.remove()时，不仅仅 - 我希望淡化消失的方式与使模态消失的任何动作上的模态相同：fadeOut()， hide()等等。

这是一个要测试的jsFiddle（如果您有任何想法）：http://jsfiddle.net/n5fqS/

我正在寻找的是一个解决方案来处理所有情况。

Answer 1

隐藏元素的方法有很多种（删除div的内容，更改css“display”属性，fadeOut（），hide（）等等），而Jquery没有将所有这些事件分组的通用事件监听器。我认为你必须手动触发“隐藏”事件作为隐藏第一个div的所有地方的回调函数。例如：

$(".dismiss").click(function() {
    $("#div-one").hide(function(){
          $(this).trigger('hide');
    });
});

然后你只需要有一次事件处理程序：

$("#div-one").on('hide', function(){ 
        //code that hides my second div 
)};

当然，您必须在相关的每个地方手动添加触发器。所以它不是“一个解决方案”。

Answer 2

您可以使用jquery dialog来实现此功能。

Answer 3

简短的回答似乎是：jQuery不会在hide上发出事件。

为了解决这个问题，我使用了the best solution I could find，并启动了一个开放项目，以便能够发送所需的事件：https://github.com/hypesystem/showandtell.js

目前应该涵盖最常见的用例。对此有任何反馈意见。

Answer 4

试试这个

$(".dismiss").click(function() {
    $("#div-one").hide(function(){
          $("#div-two").hide('slow');
    });
});