diff --git a/demo/index.html b/demo/index.html
index c9f78cc..3abce81 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -108,8 +108,8 @@
diff --git a/dist/stratum.js b/dist/stratum.js
index 06875e5..32feeb9 100644
--- a/dist/stratum.js
+++ b/dist/stratum.js
@@ -101,11 +101,16 @@
}, options);
var grid = $(this);
+ var heights = [];
// Count of the columns and default padding gap
var columns = settings.columns;
var padding = settings.padding;
+ // Default positions
+ var top = 0;
+ var left = -100 / columns;
+
// Iterate and reformat each matched element
return this.each(function () {
@@ -115,11 +120,6 @@
position: 'relative'
});
- // Array with items height
- var items = [];
- var top = 0;
- var left = -100 / columns;
-
//
// Main cycle: there we will check current coordinates
grid.children().each(function (i, obj) {
@@ -141,57 +141,47 @@
});
// Save height value in main array to check top positions
- items.push(gridItem.parent().outerHeight(true));
-
- // Set top position
- if (items[i - columns] === undefined) {
- top = 0;
- } else {
- var itemNumber = i;
- top = 0;
- while (itemNumber >= columns) {
- top += items[itemNumber - columns];
- itemNumber -= columns;
- }
- }
+ heights.push(gridItem.parent().outerHeight(true));
// Update and set new position values
gridItem.parent().css({
- top: top
+ top: getTopPosition(gridItem, i)
});
});
}
function resize() {
- var items = [],
- top = 0;
+ heights = [];
+ top = 0;
grid.children().each(function (i, obj) {
-
var gridItem = $(obj);
- // Save height value in main array to check top positions
- items.push(gridItem.outerHeight(true));
-
- // Set top position
- if (items[i - columns] === undefined) {
- top = 0;
- } else {
- var itemNumber = i;
- top = 0;
- while (itemNumber >= columns) {
- top += items[itemNumber - columns];
- itemNumber -= columns;
- }
- }
+ heights.push(gridItem.outerHeight(true));
// Update and set new position values
gridItem.css({
- top: top
+ top: getTopPosition(gridItem, i)
});
});
}
+ //
+ // Get current top position value
+ function getTopPosition(obj, index) {
+ if (heights[index - columns] === undefined) {
+ top = 0;
+ } else {
+ var itemNumber = index;
+ top = 0;
+ while (itemNumber >= columns) {
+ top += heights[itemNumber - columns];
+ itemNumber -= columns;
+ }
+ }
+ return top;
+ }
+
$(window).on('load', function () {
init();
}).on('resize', function () {
diff --git a/dist/stratum.min.js b/dist/stratum.min.js
index 6bd8cbe..c50bba3 100644
--- a/dist/stratum.min.js
+++ b/dist/stratum.min.js
@@ -1 +1 @@
-!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";var r;(r=jQuery).fn.stratum=function(e){var t=r.extend({padding:15,columns:3},e),n=r(this),o=t.columns,i=t.padding;return this.each(function(){r(window).on("load",function(){!function(){n.css({position:"relative"});var e=[],t=0,u=-100/o;n.children().each(function(n,a){var c=r(a);if("grid_item"!==c.attr("class")&&c.wrap(''),n%o==0?u=0:u+=100/o,c.parent().css({position:"absolute",width:100/o+"%",left:u+"%",padding:i}),e.push(c.parent().outerHeight(!0)),void 0===e[n-o])t=0;else{var f=n;for(t=0;f>=o;)t+=e[f-o],f-=o}c.parent().css({top:t})})}()}).on("resize",function(){var e,t;e=[],t=0,n.children().each(function(n,i){var u=r(i);if(e.push(u.outerHeight(!0)),void 0===e[n-o])t=0;else{var a=n;for(t=0;a>=o;)t+=e[a-o],a-=o}u.css({top:t})})})})}}]);
\ No newline at end of file
+!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";var r;(r=jQuery).fn.stratum=function(e){var t=r.extend({padding:15,columns:3},e),n=r(this),o=[],i=t.columns,u=t.padding,c=0,a=-100/i;return this.each(function(){function e(e,t){if(void 0===o[t-i])c=0;else{var n=t;for(c=0;n>=i;)c+=o[n-i],n-=i}return c}r(window).on("load",function(){n.css({position:"relative"}),n.children().each(function(t,n){var c=r(n);"grid_item"!==c.attr("class")&&c.wrap(''),t%i==0?a=0:a+=100/i,c.parent().css({position:"absolute",width:100/i+"%",left:a+"%",padding:u}),o.push(c.parent().outerHeight(!0)),c.parent().css({top:e(0,t)})})}).on("resize",function(){o=[],c=0,n.children().each(function(t,n){var i=r(n);o.push(i.outerHeight(!0)),i.css({top:e(0,t)})})})})}}]);
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 02ab755..0dbc53c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -8,11 +8,16 @@
}, options);
let grid = $(this);
+ let heights = [];
// Count of the columns and default padding gap
let columns = settings.columns;
let padding = settings.padding;
+ // Default positions
+ let top = 0;
+ let left = -100 / columns;
+
// Iterate and reformat each matched element
return this.each(function () {
@@ -22,11 +27,6 @@
position: 'relative'
});
- // Array with items height
- let items = [];
- let top = 0;
- let left = -100 / columns;
-
//
// Main cycle: there we will check current coordinates
grid.children().each(function (i, obj) {
@@ -48,59 +48,47 @@
});
// Save height value in main array to check top positions
- items.push(gridItem.parent().outerHeight(true));
-
- // Set top position
- if (items[i - columns] === undefined) {
- top = 0;
- } else {
- let itemNumber = i;
- top = 0;
- while (itemNumber >= columns) {
- top += items[itemNumber - columns];
- itemNumber -= columns;
- }
- }
+ heights.push(gridItem.parent().outerHeight(true));
// Update and set new position values
gridItem.parent().css({
- top: top
+ top: getTopPosition(gridItem, i)
});
});
}
function resize() {
-
- // TODO: Create setTopPosition function;
-
- let items = [], top = 0;
+ heights = [];
+ top = 0;
grid.children().each(function (i, obj) {
-
let gridItem = $(obj);
- // Save height value in main array to check top positions
- items.push(gridItem.outerHeight(true));
-
- // Set top position
- if (items[i - columns] === undefined) {
- top = 0;
- } else {
- let itemNumber = i;
- top = 0;
- while (itemNumber >= columns) {
- top += items[itemNumber - columns];
- itemNumber -= columns;
- }
- }
+ heights.push(gridItem.outerHeight(true));
// Update and set new position values
gridItem.css({
- top: top
+ top: getTopPosition(gridItem, i)
});
});
}
+ //
+ // Get current top position value
+ function getTopPosition(obj, index) {
+ if (heights[index - columns] === undefined) {
+ top = 0;
+ } else {
+ let itemNumber = index;
+ top = 0;
+ while (itemNumber >= columns) {
+ top += heights[itemNumber - columns];
+ itemNumber -= columns;
+ }
+ }
+ return top;
+ }
+
$(window).on('load', function () {
init();
}).on('resize', function () {