npm install tessellate-js
|2||downloads in the last month|
|Version||0.0.2 last updated 5 months ago|
|Dependencies||grunt, grunt-contrib-uglify, grunt-contrib-jshint, grunt-contrib-cssmin|
Install via npm:
npm install tessellate-js.
When you remove a floated element from the DOM, all the other elements simply occupy the now unallocated space immediately. However, with Tessellate, unallocated space due to removed nodes are occupied gracefully with CSS3 animations.
First you need to create a new instance of Tessellate for each container you want this behaviour on.
var colours = document.querySelector('section.colours'), tessellate = new Tessellate(colours);
And then whenever you remove an element, tell Tessellate which element you wish to remove, and the module will do the rest for you.
As a side note, it's not necessary to simply remove an element from the DOM ungracefully. You can dim its opacity or any other effect, but at the point of physical removal from the DOM, invoke