砌體項目較低的不透明度而不是隱藏

Question

我知道默認砌體行爲是隱藏項目，當項目處於活動狀態（其他類別被選中），但在我的代碼中，它將不透明度降低到0.25而不是隱藏和所有其他項目重組：http://veritaswp.excellence.lt/en/photo-gallery/

還有就是我的CSS代碼：

.project.inactive { 
    opacity: .25 !important; 
    pointer-events: none !important; 
} 

我已經試過，而不是opacity參數寫display: none，但磚石項目仍然需要空間（因爲石工項目與position: absolute，我猜）。

我該如何解決這個問題？如何隱藏石工項目與所有項目重組，而不是降低它的opacity？

Answer 1

您可以在容器上再次使用display: none上要隱藏第一項，然後 呼叫磚石像這樣：

$(".masonry").masonry(); 

或者

$(".masonry").masonry("layout"); 

也就是說，如果你使用jQuery的。如果你使用普通的JavaScript，只需要做同樣的事情。

通過display:none這種方式，您的不需要的物品將從流程中移除，並且通話佈局將相應地重新排列您的剩餘物品。

編輯Codepen example