Escalar dinámicamente elementos en relación con su contenedor-escalable
| Autor: | ScriptArtist |
|---|---|
| Views Total: | 931 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 14, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
Scalable es una biblioteca de cambio de tamaño de elementos JavaScript simple y ligera que cambia dinámicamente el tamaño de cualquier elemento manteniendo la relación de aspecto original y la alineación dentro de su contenedor principal.
Install the scalable with NPM:
$ npm install scalable
Funcionamiento
Importe el JavaScript escalable en el documento.
<script src="build/scalable.js"></script>
Supongamos que tiene un elemento dentro del elemento ' container ' como este:
<div class="container"> <div class="myElement"> Resizable element here </div> </div>
Cree un nuevo objeto escalable y especifique el elemento contenedor.
var scalable = new Scalable(".container", {
// options here
}); Eso es todo. Todas las opciones posibles para personalizar el Scalable.
var scalable = new Scalable(".container", {
// left | center | right
align: left,
// top | center | bottom
verticalAlign: top,
// fixed | auto
containerHeight: fixed,
// minimum width
minWidth: null,
// maximum width
maxWidth: null,
// minimux scale
minScale: null,
// maximum scale
maxScale: null
});
