我已经用slideToggle创建了下拉模式，但切换功能没有隐藏模式掩码

Question

我有使用slideToggle的下拉菜单，我正在添加一些额外的效果，如点击下拉菜单上的蒙版。我在下拉菜单的背景中显示了一种模式蒙版。在点击out side时，我隐藏了遮罩，拉菜单是切换和关闭(pull up)。但是我不能在点击.puller类的时候隐藏遮罩，第二次我的菜单被切换和弹出，但是背景遮罩没有隐藏。

$(".puller").click(function() {
    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();
    //Set height and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});
    //transition effect     
    $('#mask').fadeTo("slow",0.6);  
    $(".patientDetail").slideToggle();
 });

 $('#mask').click(function () {
    $(this).fadeTo("fast",0);   
    $(this).hide("fast");
    $(".patientDetail").slideToggle();
 }); 

Answer 1

我已经修改了下面的代码，它工作正常

$(".puller").click(function() {
    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();
    //Set height and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});
    //transition effect     
    $('#mask').fadeTo("slow",0.6);  
    $(".patientDetail").slideToggle(function() {
          if($(this).is(":hidden")) {
         alert("this was a slide up");
       } 
     });
 });