Author: | thatisuday |
---|---|
Official Page: | Go to website |
Publish Date: | November 14, 2017 |
License: | MIT |
Description:
ngx-image-gallery is a modal and inline image gallery library for Angular 4+ app.
Installation:
npm install --save ngx-image-gallery
Usage:
<ngx-image-gallery [images]="images" [conf]="conf" (onOpen)="galleryOpened($event)" (onClose)="galleryClosed()" (onImageChange)="galleryImageChanged($event)" (onDelete)="deleteImage($event)" ></ngx-image-gallery>
Interface:
export interface GALLERY_CONF { imageBorderRadius?: string; imageOffset?: string; showDeleteControl?: boolean; showCloseControl?: boolean; showExtUrlControl?: boolean; showArrows?: boolean; showImageTitle?: boolean; showThumbnails?: boolean; closeOnEsc?: boolean; reactToKeyboard?: boolean; reactToMouseWheel?: boolean; reactToRightClick?: boolean; thumbnailSize?: number; backdropColor?: string; inline?: boolean; } export interface GALLERY_IMAGE { _cached?: boolean; url: string; thumbnailUrl?: string; altText?: string; title?: string; extUrl?: string; extUrlTarget?: string; }
Configs.
const DEFAULT_CONF: GALLERY_CONF = { imageBorderRadius: '3px', imageOffset: '20px', showDeleteControl: false, showCloseControl: true, showExtUrlControl: true, showImageTitle: true, showThumbnails: true, closeOnEsc: true, reactToKeyboard: true, reactToMouseWheel: true, reactToRightClick: false, thumbnailSize: 30, backdropColor: 'rgba(13,13,14,0.85)', inline: false, showArrows: true };