Image zoom effect

Ask the community
, ,
1

Question:
improve my zoom effect, especially on the edges

Product:
Wix Editor

What are you trying to achieve:
Hello dear wix experts !
My zoom effect cannot show the edges of my image, because I must scroll to the right or to the bottom, and I get out the image, so the zoom effect is deactivated.

What have you already tried:
Here is the link to my page: https://novyel.wixsite.com/website-5/liste-lecture/a41b527d-955e-43c9-85bf-dded80e61bb0
And the code

  1. in the calling page:
    import wixWindowFrontend from "wix-window-frontend";

    $w('#image').onClick(() => {
        wixWindowFrontend.openLightbox("image lightbox", $w('#image'));
    })
  1. in the called lightbox (thanks to Mark Hunte):
import wixWindowFrontend from 'wix-window-frontend';
import { timeline } from "wix-animations-frontend";

$w.onReady(function () {

    let receivedImage = wixWindowFrontend.lightbox.getContext();
    $w('#image1').src = receivedImage.src;

    let mode = $w("#image1").fitMode;
    $w("#image1").fitMode = "fixedWidth";

    const zoomTimeline = timeline()
    .add($w("#image1"), {
        duration: 1000,
        scale: 2,
    })

$w("#image1").onMouseIn(() => {
    zoomTimeline.play();
});

$w("#image1").onMouseOut(() => {
    zoomTimeline.reverse();
});

});

Additional information:
Is it possible to move the mouse to the right or the bottom and to see the zoom effect on those parts of the image ?

Thank you very much for your help