OLD | NEW |
1 <style> | 1 <style> |
2 body { | 2 body { |
3 display: none; | 3 display: none; |
4 margin: 0; | 4 margin: 0; |
5 } | 5 } |
6 .item { | 6 .item { |
7 max-width: 200px; | 7 max-width: 200px; |
8 border: 2px solid red; | 8 border: 2px solid red; |
9 margin: 1px; | 9 margin: 1px; |
10 } | 10 } |
(...skipping 1098 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1109 } | 1109 } |
1110 return -1 | 1110 return -1 |
1111 }; | 1111 }; |
1112 "function" == typeof define && define.amd ? define(["outlayer/outlayer", | 1112 "function" == typeof define && define.amd ? define(["outlayer/outlayer", |
1113 "get-size/get-size"], b) : "object" == typeof exports ? | 1113 "get-size/get-size"], b) : "object" == typeof exports ? |
1114 module.exports = b(require("outlayer"), require("get-size")) : | 1114 module.exports = b(require("outlayer"), require("get-size")) : |
1115 a.Masonry = b(a.Outlayer, a.getSize) | 1115 a.Masonry = b(a.Outlayer, a.getSize) |
1116 }(window); | 1116 }(window); |
1117 var container = document.querySelector('#container'); | 1117 var container = document.querySelector('#container'); |
1118 var item = container.children[0]; | 1118 var item = container.children[0]; |
1119 for (var i = 0; i < 100; ++i) { | 1119 for (var i = 0; i < 10; ++i) { |
1120 container.appendChild(item.cloneNode(true)); | 1120 container.appendChild(item.cloneNode(true)); |
1121 } | 1121 } |
1122 document.body.style.display = 'block'; | 1122 document.body.style.display = 'block'; |
1123 window.done = false; | 1123 window.done = false; |
1124 window.brick = function() { | 1124 window.brick = function() { |
1125 var mason = new Masonry(container, { | 1125 var mason = new Masonry(container, { |
1126 itemSelector: '.item', | 1126 itemSelector: '.item', |
1127 }); | 1127 }); |
1128 requestAnimationFrame(function() { | 1128 requestAnimationFrame(function() { |
1129 mason.element.style.maxWidth = '950px'; | 1129 mason.element.style.maxWidth = '950px'; |
1130 mason.layout(); | 1130 mason.layout(); |
1131 requestAnimationFrame(function() { | 1131 requestAnimationFrame(function() { |
1132 window.done = true; | 1132 window.done = true; |
1133 }); | 1133 }); |
1134 }); | 1134 }); |
1135 }; | 1135 }; |
1136 </script> | 1136 </script> |
OLD | NEW |