bianco.images-loader

Modern images loader helpers written in es2015 using generators and promises

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
bianco.images-loader
1.2.02 years ago7 years agoMinified + gzip package size for bianco.images-loader in KB

Readme

bianco.images-loader
!Build Statusci-imageci-url !NPM versionnpm-version-imagenpm-url !NPM downloadsnpm-downloads-imagenpm-url !MIT Licenselicense-imagelicense-url
Modern images loader helpers written in es2015 using promises

Usage

Load a single image

import { loadImage } from 'bianco.images-loader'

loadImage('path/to/the/image.jpg').then(img => document.body.appendChild(img))

Or also DOM nodes:
import $ from 'bianco.query'
import { loadImage } from 'bianco.images-loader'

loadImage($('img.cool'))
  .then(img => img.classList.add('loaded'))
  .catch(function(error) {
    // there was an error loading the image
  })

Load a multiple images

import { loadImages } from 'bianco.images-loader'

loadImages([
    'path/to/the/image1.jpg',
    'path/to/the/image2.jpg'
  ])
  .then(imgs => imgs.forEach(i => document.body.appendChild(i)))
  .catch(error => {
    // there was an error loading one of images
  })

Or also...
import $ from 'bianco.query'
import { loadImages } from 'bianco.images-loader'

loadImages($('img', '.main-content'))
  .then(imgs => imgs.forEach(i => i.classList.add('loaded')))
  .catch(error => {
    // there was an error loading one of images
  })

API

Table of Contents

-   [Parameters](#parameters)
-   [Parameters](#parameters-1)

loadImage

Preload any image

Parameters


Returns Promise a promise that will be resolved when the image will be completely loaded

loadImages

Load in parallel a collection of images

Parameters


Returns
Promise a promise that will be resolved when all the images will be loaded