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 
})