Minigrid
Minigrid is a minimal 2kb zero dependency cascading grid layout.
Website & Documentation: http://minigrid.js.org/.
Contributing
Plese see CONTRIBUTING.
License
MIT © 2016 Henrique Alves
Minimal 2kb zero dependency cascading grid layout
Minigrid is a minimal 2kb zero dependency cascading grid layout.
Website & Documentation: http://minigrid.js.org/.
Plese see CONTRIBUTING.
MIT © 2016 Henrique Alves
overflow: hidden
https://github.com/henriquea/minigrid/issues/60npmcdn
url https://github.com/henriquea/minigrid/pull/57master
branchpackage.json
The major change is the API. We took one step back to its core principle of "keep it simple".
var props = {
container: '.cards',
item: '.card',
guter: 8
};
var grid = new Minigrid(props);
grid.mount();
mount()
method to initialize MinigridposX
, poxY
values #48forEach
loopwindow.onload
function for window.addEventListener('load')
. Closes #36backface-visibility
to prevent text rendering issues. Closes #26gutter
to 0
--loaded
modifier multiple timesThe major change is that now minigrid receives a props
object rather arguments.
// v1.x
minigrid('.grid', '.grid-item');
// v2.0.0
minigrid({ container: '.grid', item: '.grid-item'});
On window.onLoad
minigrid adds a new className, the container name plus the --loaded
modifier.
<div class="grid grid--loaded">
...
</div>
The same happens for each grid child item when it is ready for use.
<div class="grid grid--loaded">
<div class="grid-item grid-item--loaded">
</div>