Installation
Install the npm package.
npm i ngx-blurred-image
Import module:
import { BlurredImageComponent } from 'ngx-blurred-image/components';
@NgModule({
declarations: [ BlurredImageComponent ]
})
Usage
<div blurred-image
[small]="base64"
preview="/assets/img/annie-spratt-419262-preview.jpg"
[size]="{width: 880, height: 587}"
></div>
Properties
name | type | description |
---|
small | string | Thumbnail image in base64 format. |
preview | string | Path to full-size image. |
size | object | Width and height of the container with the image. |
delay | number | The delay in ms before showing the image. |
Demo
http://crystalui.org/components/blurred-image/example