Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

ส่ง Mouse Clicks ผ่าน Overlay Div (Pointer Events None)

2 วิธีหลัก

1. CSS pointer-events: none (ง่ายที่สุด)

.overlay {
    pointer-events: none; /* คลิกทะลุไป element ใต้ได้ */
}

รองรับทุกเบราว์เซอร์สมัยใหม่ (IE11+)

2. JavaScript: Forward Event

overlay.addEventListener('click', function(e) {
    var x = e.clientX, y = e.clientY;
    overlay.style.display = 'none'; // ซ่อนชั่วคราว
    var target = document.elementFromPoint(x, y); // หา Element ใต้
    overlay.style.display = ''; // แสดงกลับ
    if (target) target.click(); // Trigger Click
});

วิธีที่ 1 แนะนำสำหรับ Overlay แบบ Static (ไม่ต้องการ Interaction) วิธีที่ 2 สำหรับ Overlay ที่บางส่วนต้องการ Click บางส่วน Forward