1.0.1 • Published 3 years ago

img-loading v1.0.1

Weekly downloads
-
License
ISC
Repository
github
Last release
3 years ago

img-loading

simple React Component To Display Loader untill Image Loaded Scuccessfully, And Show Error Image When Target Image Cause Error

Screenshots

ezgif com-gif-maker

Installation

npm install img-loading --save

Example Usage

import React, { Component } from 'react'
import ImageLoader from "img-loading"
class App extends Component {
  
     render() {
      return(
        <ImageLoader 
            imageSrc={"https://example.com/image_1"}
            errorImageSrc={"https://example.com/image_1"}  
            loader={LoaderComponent}
            alt={"acount image"}
          />
      )
     }
}
export default App

Props

Prop NameDescriptionType
imageSrcscr Attribute For Image To Loadstring
errorImageSrcscr Attribute For Image To Load When Main Image Cause Errorstring
loaderLoader Component to Display While Image LoadingComponent
altalt Attribute For Imagestring

Customize Style

.image-container{  /* Root Element */  }
 
.image-container img{  /* Your Image Element */  }

.image-container .image-container-overlay{ /* Loader Overlay Element */   }

Report an issue if you find there's something wrong