Bagaimana untuk Menghalang Penatalan Elemen Induk Apabila Elemen Kanak-kanak Tetap dan Boleh Ditatal Mencapai Pinggirnya?

Halang Menatal Elemen Induk Apabila Anak Mencapai Tepi

Apabila menggunakan elemen tetap dan boleh tatal dalam induknya, adalah wajar untuk menyekat penatalan ibu bapa apabila elemen anak mencapai bahagian atas atau bawahnya. Isu ini timbul apabila menatal dalam elemen anak dan elemen induk mengambil alih, menyebabkan tatal yang tidak diingini di latar belakang.

Percubaan Penyelesaian dan Hadnya

Pada mulanya, acara Kaedah .stoppropagation() telah digunakan untuk menghentikan penyebaran peristiwa. Walau bagaimanapun, kaedah ini terbukti tidak berkesan kerana pembiakan masih berlaku.

Penyelesaian Komprehensif

Penyelesaian yang lebih berkesan melibatkan pengendalian acara roda tetikus menggunakan jQuery. Penyelesaiannya menggunakan sifat wheelDelta, di mana nilai positif menunjukkan tatal ke atas dan nilai negatif menunjukkan tatal ke bawah.

Berikut ialah penjelasan terperinci skrip:

1. Pengendalian Acara: Kod jQuery mendengar acara 'DOMMouseScroll' (untuk Firefox) dan 'mousewheel' (untuk penyemak imbas lain) pada elemen dengan kelas '.Scrollable'.
2. Pengesanan Arah Menatal: Nilai delta digunakan untuk menentukan arah menatal.
3. Cegah Tindakan Lalai: Fungsi mencegah ditakrifkan untuk menghentikan penatalan.
4. Pemeriksaan Kes Tepi : Skrip menyemak kes tepi di mana penatalan akan melepasi kedudukan minimum atau maksimum elemen boleh tatal.
5. Melaraskan Kedudukan Tatal: Jika kes tepi dikesan, skrip akan ditetapkan nilai scrollTop sama ada 0 (atas) atau scrollHeight (bawah) elemen boleh tatal.
6. Pembatalan Acara: Fungsi mencegah dilaksanakan untuk membatalkan acara sepenuhnya, memastikan ia berlaku tidak disebarkan kepada elemen induk.

Dengan menggunakan penyelesaian ini, tatal yang tidak diingini dalam elemen induk boleh dicegah dengan berkesan, tanpa mengira penyemak imbas yang digunakan.

Atas ialah kandungan terperinci Bagaimana untuk Menghalang Penatalan Elemen Induk Apabila Elemen Kanak-kanak Tetap dan Boleh Ditatal Mencapai Pinggirnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!