Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Melumpuhkan Tatal dalam JavaScript buat sementara waktu tanpa Menyembunyikan Bar Tatal?

Bagaimana untuk Melumpuhkan Tatal dalam JavaScript buat sementara waktu tanpa Menyembunyikan Bar Tatal?

Barbara Streisand
Barbara Streisandasal
2024-12-21 01:45:10265semak imbas

How to Temporarily Disable Scrolling in JavaScript without Hiding the Scrollbar?

Cara Melumpuhkan Tatal Sementara

Salah satu cara untuk melumpuhkan tatal buat sementara waktu semasa menggunakan pemalam scrollTo jQuery ialah melaraskan CSS badan " "elemen. Walau bagaimanapun, pendekatan ini boleh menyembunyikan bar skrol, yang mungkin tidak diingini.

Penyelesaian yang lebih berkesan ialah menghalang peristiwa interaksi tertentu daripada mencetuskan penatalan. Acara ini termasuk:

  • Tatal tetikus
  • Tatal sentuh
  • Butang yang dikaitkan dengan tatal

Untuk melaksanakan penyelesaian ini, anda boleh menggunakan kod JavaScript berikut:

// Disable scrolling
function disableScroll() {
  window.addEventListener('DOMMouseScroll', preventDefault, false); // older FF
  window.addEventListener('wheel', preventDefault, { passive: false }); // modern desktop
  window.addEventListener('touchmove', preventDefault, { passive: false }); // mobile
  window.addEventListener('keydown', preventDefaultForScrollKeys, false);
}

// Enable scrolling
function enableScroll() {
  window.removeEventListener('DOMMouseScroll', preventDefault, false);
  window.removeEventListener('wheel', preventDefault, { passive: false }); 
  window.removeEventListener('touchmove', preventDefault, { passive: false });
  window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}

Kod ini menetapkan pendengar acara pada elemen tetingkap kepada menghalang tindakan menatal lalai daripada dicetuskan. Apabila anda perlu melumpuhkan penatalan, panggil fungsi disableScroll(); untuk mendayakan semula penatalan, panggil fungsi enableScroll().

Pendekatan ini membolehkan bar skrol kekal kelihatan tetapi menghalangnya daripada digunakan untuk menatal. Ia juga berfungsi merentas pelbagai pelayar.

Atas ialah kandungan terperinci Bagaimana untuk Melumpuhkan Tatal dalam JavaScript buat sementara waktu tanpa Menyembunyikan Bar Tatal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn