stylescape/ts/media/ImageZoomManager.ts

Stylescape is a visual identity framework developed by Scape Agency.

// Handles zoom-in and zoom-out functionalities for images.

export default class ImageZoomManager {
    private image: HTMLImageElement;
    private zoomFactor: number = 1.2;

    constructor(imageId: string) {
        this.image = document.getElementById(imageId) as HTMLImageElement;
    }

    zoomIn(): void {
        this.image.style.transform = `scale(${this.zoomFactor})`;
        this.zoomFactor *= 1.2;
    }

    zoomOut(): void {
        this.zoomFactor /= 1.2;
        this.image.style.transform = `scale(${this.zoomFactor})`;
    }
}