隱藏滾動條時，彈出轉換

Question

請看看這個FIDDLE（//更新）

這是我的應用程序的抽象。隱藏彈出窗口後，它將從DOM中移除（ReactJS中的ReactCSSTransitionGroup）。

當我隱藏彈出窗口時，它展開.main-content，所以一個令人討厭的scorllbar出現一秒鐘。

簡單的答案是將overflow:hidden添加到.main-content，但我不想這樣。

我能做些什麼比，刪除與此滑下彈出，但沒有擴大主要內容

Answer 1

變化的元素，而不是margin-bottom的height：

$('#hide').click(function() { 
    $('.popup').css("height","0px") 
}); 
$('#pop').click(function() { 
    $('.popup').css("height","100px")  
}); 

JSFiddle