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

Touchmove pointer-events: none CSS ไม่ทำงานบน Chrome Android 4.4 / ChromeView

ปัญหา: pointer-events:none ไม่บล็อก Touch Events บน Android 4.4 WebView

แก้: ใช้ touchstart + preventDefault()

overlay.addEventListener('touchstart', function(ev) {
    ev.preventDefault(); // บล็อก Touch Event ทั้งหมด
});

pointer-events: none ทำงานกับ Mouse Events แต่บน Touch ต้องใช้ touch-action: none หรือ preventDefault() บน Touch Events

Modern Solution: touch-action

.overlay {
    touch-action: none; /* ปิด Browser Default Touch Behavior */
    pointer-events: none; /* ปิด Mouse Events */
}

touch-action: none รองรับ Chrome 35+, Firefox 29+, IE10+, Safari 13+