I was intrigued by the multi grid option that Unsplash has for users to view the photographs. It is a minimal user friendly way to give a dynamic grid viewing option.
With some simple CSS and jQuery I was able to reproduce this feature.
Result
See the Pen Dynamic Multi Grid Navigation by Jeremy Faucher (@jeremyfaucher) on CodePen.
I used a Boostrap style of grid for this example the utilizes the CSS float
property.
The navigation boxes ia a fun CSS trick that just uses a div
for each box with a black background and padding.
The jQuery is using the on click function with add and remove classes to toggle the grid.
Conclusion
Sometime the simplest solution work the best. Custom CSS, no icons and yes I did give in to jQuery.