Problem – position Image Zoooom

Hi,

I see the problem. On the other hand I don’t know what is going on there without looking at least in the HTML code.

Could you please give the link to the website? Or the credentials to the admin? Alternatively, could you deactivate other plugins and see if that solves the problem (there could be a plugin conflict). Also try to switch to a theme like twentyfifteen to see if the theme is causing the conflict.

Hi.
Sorry, this is project at work.
I can not give you access to website and admin.
I have Visual Composer plugin. Maybe this is problem.

At the very top of the page it is ok.
But below plugin Image Zoooom begins to move up.
Check scroll bar on the right (photo earlier)
This problem occurs on 3/4 page.
If I set the photo above then it reduces the difference.

Hi,

I tried on my computer the plugin with Visual Composer and putting the image in the lower part of the page, but unfortunately couldn’t replicate the weird behavior.

Maybe you can come back to me when you make the website public. I really cannot figure out anything unless I see at least the HTML code.

Hello.
Hm… I don’t know, what the problem.

I send list of plugins which include to the project:
Advanced Custom Fields
Clef Two-Factor Authentication
Contact Form 7
Duplicate Menu
Limit Login Attempts
Logo Slider
Mindmeister Shortcode
Newsletter
Post Duplicator
WordPress Importer
Disable WP Admin Bar Removal
WPBakery Visual Composer (Artbees Modified Version)
WPML Multilingual CMS

Template:
https://themeforest.net/item/jupiter-multipurpose-responsive-theme/5177775

I check and edit js code.
In my opinion this is problem with “top” attribute in file jquery.image_zoom.min.js.

I use jsbeatifuler, and edit code.
I found problem with “b” parameter, and exactly the problem with b.img_small.offset.top.

I change value:

b.zoomContainer.css({
top: b.img_small.offset.top, //change this value
left: b.img_small.offset.left
});

and

buildZoomContainer: function() {
            var b = this;
            b.zoomContainer = a("<div />").addClass("zoomContainer").css({
                "-webkit-transform": "translateZ(0)",
                position: "absolute",
                left: b.img_small.offset.left + "px",
                top: b.img_small.offset.top + "px", //change this value to 35% (it was almost ok)
                height: b.img_small.height + "px",
                width: b.img_small.width + "px",
                "z-index": "999"
            }).appendTo("body")
        },

When I change value (/\) then image show in right place, but mouse move was read in old (“bad”) place (above from the picture).

Obviously the javascript doesn’t interpret correctly where the image is. Is the image’s position absolute?

Did you try to deactivate the other plugins in turn to see if there is a conflict? Did you try to change the theme? That could be really useful to see if there is a conflict there.