fancybox.bind('.scroll_fancyboxhz img', {
    animated: false,
    showclass: false,
    hideclass: false,

    dragtoclose: false,

    closebutton: "top",

    thumbs: false,
    toolbar: false,

    // disable touch guestures
    carousel: {
        panzoom: {
            touch: false,
        },
    },

    image: {
        zoom: false,
        wheel: false,
        click: "close",
        fit: "contain-w",
    },

    on: {
        ready: (fancybox, slide) => {
            fancybox.clienty =
                (fancybox.options.event && fancybox.options.event.clienty) || 0;

            fancybox.$container.addeventlistener("mousemove", (e) => {
                fancybox.clienty = e.clienty;

                fancybox.trigger("mousemove");
            });
        },
        "done carousel.change": (fancybox) => {
            fancybox.trigger("mousemove");
        },
        mousemove: (fancybox) => {
            const slide = fancybox.getslide();

            if (!slide || !slide.$image || slide.state !== "done") {
                return;
            }

            const $el = slide.$el;

            const imageheight = slide.$image.clientheight;

            const style = window.getcomputedstyle($el);

            const paddingtop = parsefloat(style.paddingtop);
            const paddingbottom = parsefloat(style.paddingbottom);

            const viewportheight = $el.clientheight - paddingtop - paddingbottom;
            const pointery = fancybox.clienty - paddingtop;

            $el.scrolltop =
                (pointery * (imageheight - viewportheight)) / viewportheight;
        },
    },
});