medium-image-progressive v1.0.2

medium-image-progressive

Medium's progressive image style.

Demo

Installation

NPM

npm i medium-image-progressive

UMD

name: mediumImageProgressive
unpkg

Usage

import mediumImageProgressive from 'medium-image-progressive'
mediumImageProgressive('img selector', {
  // options
})

Options

• progressImageUrlGetter
  the thumb image url getter
  default: (elem) => elem.getAttribute('src')
• originImageUrlGetter
  default: (elem) => elem.getAttribute('data-src')
• widthGetter
  image's width getter
  default elem => elem.getAttribute('width')
• heightGetter
  default: elem => elem.getAttribute('height')

React Component

import MPImg from 'medium-image-progressive/dist/react'

// render
<MPImg
  progressUrl="https://cdn-images-1.medium.com/freeze/max/30/1*LyAN2qcxGdVXXQBiV7IuGQ.jpeg?q=20"
  originUrl="https://cdn-images-1.medium.com/max/800/1*LyAN2qcxGdVXXQBiV7IuGQ.jpeg"
  width="700"
  height="480"
/>