Diseño web minimalista de albañilería en Pure JavaScript-Minimasonería. js
| Autor: | Spope |
|---|---|
| Views Total: | 1,591 |
| Sitio oficial: | Ir a la web |
| Actualizado: | December 7, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
Minimasonería. js es una biblioteca de JavaScript ligera (~ 3Kb) para crear un diseño de cuadrícula adaptable, fluido, para un diseño web moderno.
Funcionamiento
La estructura HTML básica para el diseño de cuadrícula.
<div class="example"> <div class="item" style="height: 150px;">1</div> <div class="item" style="height: 50px;">2</div> <div class="item" style="height: 80px;">3</div> <div class="item" style="height: 100px;">4</div> <div class="item" style="height: 70px;">5</div> <div class="item" style="height: 50px;">6</div> </div>
Descargue y coloque la versión minimizada de Minimasonería. js al final del archivo HTML.
<script src="build/minimasonry.min.js"></script>
Descargue y coloque la versión minimizada de Minimasonería. js al final del archivo HTML.
var myLayout = new MiniMasonry({
container: '.default'
}); Establezca el ancho de base en píxeles.
var myLayout = new MiniMasonry({
container: '.default',
baseWidth: 255,
}); Establezca el espacio entre los elementos de rejilla.
var myLayout = new MiniMasonry({
container: '.default',
gutter: 10,
}); Decida si desea minimizar el diseño de la cuadrícula.
var myLayout = new MiniMasonry({
container: '.default',
minify: true
});
