1. Toggle similar in jquery ()
// if the class name, you get rid of, if not, add div.classList.toggle ( "expand");
2.css3 the columns attribute to achieve waterfall layout, multi-column layout
div { Columns : 100px. 3 ; // each column is divided into three 100px, if the number of columns is reduced viewport consequent reduction -webkit-Columns : 100px. 3 ; / * Safari and the Chrome * / -moz-Columns : 100px. 3 ; / * Firefox * / }
column-width to the smallest width of the column definition. The default value auto
represents a column width is automatically adjusted according to the number of column-count column.
The maximum number COUNT-column column
column-GAP: the gap between the columns and columns, the default is 16px under ie, other browsers not given clear.
column-rule each vertical column of the gap
column-span: elements across several columns (firefox does not support)