https://github.com/scompiler/red-zoom-angular
RedZoom is a modern very easy-to-use image zoom library which made as Angular directive and fully stylable via CSS/SCSS.
https://github.com/scompiler/red-zoom-angular
angular gallery-images image-zoom magnifier magnifying-glass zoom
Last synced: 5 days ago
JSON representation
RedZoom is a modern very easy-to-use image zoom library which made as Angular directive and fully stylable via CSS/SCSS.
- Host: GitHub
- URL: https://github.com/scompiler/red-zoom-angular
- Owner: scompiler
- License: mit
- Created: 2019-10-01T03:44:00.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2024-07-20T14:01:07.000Z (11 months ago)
- Last Synced: 2025-06-01T09:20:02.162Z (18 days ago)
- Topics: angular, gallery-images, image-zoom, magnifier, magnifying-glass, zoom
- Language: TypeScript
- Homepage: https://scompiler.github.io/red-zoom-angular/
- Size: 25.4 MB
- Stars: 33
- Watchers: 2
- Forks: 11
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- fucking-awesome-angular - red-zoom-angular - A sleek and user-friendly image zoom library, designed as an Angular directive and fully customizable with CSS and SCSS. (Table of contents / Third Party Components)
- awesome-angular - red-zoom-angular - A sleek and user-friendly image zoom library, designed as an Angular directive and fully customizable with CSS and SCSS. (Table of contents / Third Party Components)
README
# RedZoom
RedZoom is a modern very easy-to-use image zoom library which made as
Angular directive and fully stylable via CSS/SCSS.Examples, documentation, changelog are available [here](https://scompiler.github.io/red-zoom-angular/).
## Getting Started
1. To install RedZoom, run the command below:
```bash
npm install ngx-red-zoom
```
2. Import module:
```typescript
import { RedZoomModule } from 'ngx-red-zoom';
@NgModule({
imports: [
RedZoomModule
]
})
export class AppModule { }
```
3. Import styles:
```scss
@import '~ngx-red-zoom/styles/base.scss';
@import '~ngx-red-zoom/styles/style-window.scss';
```
4. Add directive to your image tag:
```angular2html
![]()
```