Generar marcadores de posición de imagen personalizados con JavaScript puro-placeholder. js
| Autor: | hustcc |
|---|---|
| Views Total: | 2,221 |
| Sitio oficial: | Ir a la web |
| Actualizado: | December 18, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
placeholder. js es una biblioteca de JavaScript muy pequeña que se utiliza para generar marcadores de posición de CSS personalizables solo para imágenes.
Funcionamiento
Coloque el archivo JavaScript placeholder. js en su página web cuando sea necesario.
<script src="placeholder.js"></script>
Personalice el marcador de posición de imagen.
var opts = {
size: '1024x1024',
text: 'Hello World'
} Genere una imagen de marcador de posición 1024x1024px.
document.getElementById('selector').setAttribute('src', window.placeholder.getData(opts)); Opciones completas.
var opts = {
// image size
size: '128x128',
// background color
bgcolor: '#ccc',
// text color
color: '#969696',
// custom text
text: 'Hello World',
// custom font styles
font: {
style:'oblique',
weight: 'bold',
size:'40',
family: 'consolas'
},
} API methods.
// get the image base64 window.placeholder.getData(opts); // get the image canvas element window.placeholder.getCanvas(opts);
