ปัญหาการขยายภาพผลิตภัณฑ์ในหน้ารายละเอียดผลิตภัณฑ์เมื่อเมนูแบบเลื่อนลงมีพื้นที่ทับซ้อนกับมัน

9

ซูมทำงานได้ดี

แต่เมื่อวางเมาส์เหนือเมนูแบบเลื่อนลงหมวดหมู่ไปยังพื้นที่ทับซ้อนของภาพผลิตภัณฑ์และเมนูแบบเลื่อนลงการซูมจะทำงานตามปกติแม้เมาส์จะยังคงอยู่ในเมนูแบบเลื่อนลง

กรุณาตรวจสอบภาพจับ:

magento2 less-css zoom

— Mayur Rathod
แหล่งที่มา

ตั้งค่าดัชนี z ที่สูงขึ้นเพื่อซูมจะแก้ปัญหาของคุณ

— Manoj Deswal

@ManojDeswal ฉันลองใช้ z-index: 99999; แต่มันไม่ทำงาน คุณช่วยให้ฉันแก้ปัญหาที่เหมาะสม

— Mayur Rathod

หากคุณมี URL ออนไลน์ฉันสามารถช่วยคุณได้

— Manoj Deswal

มันทำงานได้ดีในระบบท้องถิ่นของฉัน

— Mayur Rathod

ส่ง URL ออนไลน์ของคุณหลังจากตรวจสอบแล้วฉันสามารถบอกวิธีแก้ปัญหาให้คุณได้แน่นอน

— Manoj Deswal

19

คุณต้องแทนที่รหัสของ lib / web / magnifier / magnifier.js ในชุดรูปแบบของคุณด้านล่าง

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

แทนที่ด้วย

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

เราจำเป็นต้องเพิ่มฟังก์ชั่นในเหตุการณ์ "mouseleave" ของบล็อกรูปภาพมิฉะนั้นการซูมจะแสดงหลังจากที่เม้าส์ออกจากบล็อกรูปภาพ
กรุณาเพิ่มรหัสข้างต้นและแจ้งให้เราทราบหากคุณต้องการอะไรอีก

— Nitin Vala
แหล่งที่มา

Magento 2.2.5 ฉันทำการเปลี่ยนแปลงล้างแคชแล้วและมันยังไม่ทำงานตามที่ควร ข้อเสนอแนะอื่น ๆ ?

— รูดี้ซี

กรุณาเรียกใช้คำสั่งต่อไปนี้ในไดเรกทอรีรากของวีโอไอพี -> php bin / magento s: up -> php bin / magento s: d: c แจ้งให้เราทราบว่ามันจะไม่ทำงานหลังจากสั่งการทำงานเหนือคำสั่ง

— Nitin Vala

นั่นได้ผล! ข้อความจากชื่อภาพยังคงครอปอยู่ด้านล่างนี้เป็นสิ่งที่คุณคุ้นเคยหรือไม่? ฉันหวังว่าการแก้ไขปัญหาโฮเวอร์อิมเมจจะแก้ไขปัญหาข้อความรูปภาพด้วย แต่ดูเหมือนว่าจะแยกจากกัน? ขอบคุณสำหรับความช่วยเหลือและเวลา Nitin

— รูดี้ซี

ใช่ปัญหาทั้งสองนี้เป็นเรื่องแยกต่างหากมันถูกกล่าวถึงแล้วใน git hub github.com/magento/magento2/issues/15035( ดูล่าสุด 3-4 ความคิดเห็น) มันอาจแก้ไขได้ในเวอร์ชั่นล่าสุดของ magento

— Nitin Vala

ทำงานได้กับ 2.2.4

— โจเอลเดวี่

8

สำหรับ magento เวอร์ชั่น 2.2.6 ให้แทนที่โค้ดด้านล่างในธีมของคุณ พา ธ ไฟล์ lib / web / magnifier / magnifier.js แทนที่ในแอพ / ออกแบบ / ส่วนหน้า / ผู้ขาย / โมดูล / เว็บ

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

แทนที่ด้วย

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

— Aniket Prajapati
แหล่งที่มา

ขอบคุณมันใช้งานได้ !!

— Manish Goswami

ขอบคุณ มันทำงาน ...

— soofz

6

ฉันอัพเกรดเป็น v2.2.6 และมันไม่ทำงานอีกต่อไปหลังจากนั้น
ฉันแก้ไขรหัสเช่นนี้และใช้งานได้:

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

— rudak
แหล่งที่มา

1

ฉันเพิ่งอัปเดตเป็น 2.2.6 และใช้รหัสนี้ ยังไม่ได้ทำงานให้ฉันคำแนะนำอื่น ๆ ? ขอบคุณ FYI ฉันใช้แพทช์ก่อนหน้าที่แนะนำโดย Nitin โดยไม่มีปัญหา

— รูดี้ซี

ฉันแก้ไขรหัสด้วย: $ (largeWrapper) ... ข้อผิดพลาดด้านหน้าของคุณคืออะไร?

— rudak

1

สิ่งนี้แก้ไขปัญหาของฉันใน 2.2.6 ขอบคุณ

— CDzWebDev

1

สิ่งนี้ใช้ได้กับฉันในวันที่ 2.3

— BartZalas

3

ดูเหมือนว่านี่เป็นข้อบกพร่องของ Magetno

ตรวจสอบที่นี่

ได้รับการแก้ไขรวมกับLattest Magetno 2.2.4

หากคุณใช้เวอร์ชั่นที่เก่ากว่าคุณสามารถแก้ไขไฟล์ด้านล่างเพื่อแก้ไขปัญหาได้

lib / เว็บ / แว่นขยาย / magnifier.js

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

การอ้างอิง: -ตรวจสอบการกระทำนี้ที่รวมเข้ากับวีโอไอพี 2.2.4

Update: - ถ้าคุณรวมการประชาสัมพันธ์นี้และมันจะเป็นปัญหาการซูมสำหรับคุณ มันไม่ทำงานดูเหมือนว่าการแก้ไขปัญหาหนึ่งยุ่งกับปัญหาอื่น ๆ ทำตามความเสี่ยงของคุณเอง !!!

— TBS Mage
แหล่งที่มา

3

ด้วยรุ่นล่าสุดวิธีแก้ปัญหาข้างต้นยังใช้งานไม่ได้ฉันต้องระบุคลาสดูตัวอย่างแว่นขยายโดยเฉพาะเช่นนี้:

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

— user73198
แหล่งที่มา

สิ่งนี้ไม่ได้ผลสำหรับฉันในการติดตั้งใหม่ 2.3.0 ข้อเสนอแนะใด ๆ

— รูดี้ซี

1

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

รหัสนี้ทำงานได้ดี

ขอบคุณ

— Priya
แหล่งที่มา

1

คุณสามารถหา originel magnifier.js ได้จากที่ไหน? เรามีปัญหานี้และใช้ชุดรูปแบบ Ultimo อย่างไรก็ตามแอพ / การออกแบบ / ส่วนหน้า / Infortis / ultimo เป็นวิธีที่เราได้รับ จากนั้นฉันจะสามารถสร้างเว็บ / แว่นขยาย / โฟลเดอร์ได้ แต่จะหา magnifier.js ได้จากที่ไหน?

ทุกคนเป็นแบบอย่างที่ดีหรือไม่? ขอบคุณ

— เอมิ
แหล่งที่มา

Original magnifier.js อยู่ภายใต้โฟลเดอร์ MagentoRoot / lib / web / magnifier /

— Nitin Vala