Sự cố thu phóng hình ảnh sản phẩm trên trang chi tiết sản phẩm khi menu thả xuống có vùng chồng lấp với nó

Thu phóng hoạt động tốt,

Nhưng khi di chuột trên menu thả xuống danh mục vào vùng chồng lấp của hình ảnh sản phẩm và menu thả xuống, Thu phóng vẫn hoạt động bình thường, ngay cả chuột vẫn ở menu thả xuống.

Vui lòng kiểm tra ảnh chụp:

Bạn cần thay thế mã lib / web / Magnifier / magnifier.js trong chủ đề của bạn như dưới đây.

$(document).on('mousemove', onMousemove);
_init($box, gOptions);

Thay thế bằng.

$box.on('mousemove', onMousemove);
$box.on('mouseleave', mouseleave);
function mouseleave(e) {
   onThumbLeave();
   isOverThumb = false;
   $largeWrapper.addClass(MagnifyCls.magnifyHidden);
}
_init($box, gOptions);

Chúng ta cần thêm chức năng vào sự kiện "mouseleave" của khối hình ảnh nếu không zoom sẽ hiển thị sau khi chuột rời khỏi khối hình ảnh.
Vui lòng thêm mã ở trên và cho tôi biết nếu bạn cần bất cứ điều gì khác.

Đối với phiên bản magento 2.2.6 thay thế mã bên dưới trong chủ đề của bạn. Đường dẫn tệp lib / web / Magnifier / magnifier.js Thay thế trong ứng dụng / thiết kế / frontend / nhà cung cấp / mô-đun / web

$box.on('mousemove', onMousemove);
_init($box, customUserOptions);

Thay thế bằng.

   $box.on('mousemove', onMousemove);
   $box.on('mouseleave', mouseleave);
   function mouseleave(e) {
           onThumbLeave();
           isOverThumb = false;
           $magnifierPreview.addClass(MagnifyCls.magnifyHidden);
        }
   _init($box, customUserOptions);

Tôi nâng cấp lên v2.2.6 và nó không hoạt động nữa sau đó
tôi chỉnh sửa mã như thế này và nó hoạt động:

 $box.on('mousemove', onMousemove);
    $box.on('mouseleave', mouseleave);
    function mouseleave(e) {
        onThumbLeave();
        isOverThumb = false;
        $(largeWrapper).addClass(MagnifyCls.magnifyHidden);
    }
    // _init($box, gOptions);
    _init($box, customUserOptions);

Có vẻ như đây là lỗi của Magetno.

Kiểm tra tại đây .

Bản sửa lỗi đã được hợp nhất với Lattest Magetno 2.2.4 .

Nếu bạn đang chạy phiên bản cũ hơn bạn có thể sửa đổi tệp dưới đây như một cách giải quyết.

lib / web / kính lúp / kính lúp.js

       $box.on('mousemove', onMousemove);
     _init($box, gOptions);

Tham khảo: - Kiểm tra này cam kết rằng được sáp nhập với Magento 2.2.4

Update: - Nếu bạn hợp nhất PR này và nó sẽ là vấn đề phóng to cho bạn. Nó không hoạt động Có vẻ như, Khắc phục một vấn đề Bối rối với vấn đề khác. Làm điều đó có nguy cơ của riêng bạn !!!

Với phiên bản mới nhất, giải pháp trên vẫn không hoạt động, tôi phải chỉ định lớp xem trước kính lúp cụ thể như thế này:

$box.on('mousemove', onMousemove);
$box.on('mouseleave', mouseleave);
function mouseleave(e) {
    onThumbLeave();
    isOverThumb = false;
    $('.magnifier-preview').addClass(MagnifyCls.magnifyHidden);
}
_init($box, customUserOptions);

$box.on('mousemove', onMousemove);
$box.on('mouseleave', mouseleave);
function mouseleave(e) {
   onThumbLeave();
   isOverThumb = false;
   $largeWrapper.addClass(MagnifyCls.magnifyHidden);
}
_init($box, gOptions);

Mã này hoạt động tốt.

Cảm ơn,

Bạn có thể tìm thấy Magnifier.js gốc ở đâu? Chúng tôi có vấn đề này và sử dụng chủ đề Ultimo. Tuy nhiên, ứng dụng / thiết kế / frontend / Infortis / ultimo là khoảng cách chúng ta nhận được. Sau đó, tôi có thể tạo thư mục web / kính lúp / thư mục nhưng từ đâu để có được Magnifier.js đúng?

Bất cứ ai tốt để đi ví dụ? Cảm ơn