waterfall.js/waterfall.min.js

Pinterest Grid in Just 1KB

!function(a,b){"function"==typeof define&&define.amd?define("waterfall",function(){return b}):"object"==typeof module&&module.exports?module.exports=b:a.waterfall=b}(this,function(a){function b(a){return window.getComputedStyle(a)}function c(a,c){return parseFloat(b(c)["margin"+a])||0}function d(a){return a+"px"}function e(a){return parseFloat(a.style.top)}function f(a){return parseFloat(a.style.left)}function g(a){return parseFloat(b(a).width)}function h(a){return parseFloat(b(a).height)}function i(a){return e(a)+h(a)+c("Bottom",a)}function j(a){return f(a)+g(a)+c("Right",a)}function k(a){a=a.sort(function(a,b){var c=i(b)-i(a);return c||f(b)-f(a)})}function l(a,b,c){a.style.position="absolute",a.style.top=b,a.style.left=c,r.add(a)}function m(a){l(a,"0px",d(c("Left",a)))}function n(a,b){l(b,a.style.top,d(j(a)+c("Left",b)))}function o(a,b){l(b,d(i(a)+c("Top",b)),d(f(a)))}function p(a,b){a.style.position="relative",a.style.height=d(i(b)+c("Bottom",b))}function q(b,c){return j(b[c-1])+g(b[c])<=g(a)}"string"==typeof a&&(a=document.querySelector(a));var r={els:[],add:function(a){this.els.push(a),k(this.els),this.els=this.els.slice(0,3)},min:function(){return this.els[this.els.length-1]},max:function(){return this.els[0]}},s=a.children;s.length&&m(s[0]);for(var t=1;t<s.length&&q(s,t);t++)n(s[t-1],s[t]);for(;t<s.length;t++)o(r.min(),s[t]);p(a,r.max())});