Javascript/Jquery滑动标签界面：当在标签外单击时最小化标签页

Question

我正在构建一个用户界面。当用户点击一个标签时，会触发一个函数检查其他打开的标签（通过搜索一个类“max”），最小化该标签，然后最大化点击标签并应用类“max”。我想让它工作的方式是，如果我点击文档中的其他位置，它将最小化选项卡。 任何想法？

function resize_tab(t) { 
     tab = $(t).parent() 
     console.log(tab); 
     var size = 0 - parseFloat($(".max").css("height")) + 30; 
     function resize(what,size){ 
      $(what).animate({"marginTop" : size},500,function(){}).toggleClass("max") 
      } 
     if ($(tab).hasClass("max")){ //if what you clicked is maxed... 
      resize(tab,size);   //minimize it 
      }else{      //Or else, minimize whatever is maxed... 
       resize($(".max"),size); //minimize whatever is maxed 
       resize(tab,-1);  //and maximize what you clicked. 
     } 
    }   

    $(".tab").click(function(){resize_tab(this)}) 

Answer 1

你可以把一个click事件在身上的标签，当有人点击身体就会执行代码：

$("body").click(function(){ 
    $(".tab").removeClass("max"); 
    //other resizing code as needed 
})