Bagaimana untuk Mencetuskan Peristiwa Apabila Menatal ke Elemen Tertentu dalam jQuery?

Cetuskan Peristiwa apabila Mencapai Elemen Tertentu dengan jQuery

Masalah

Seorang pengguna ingin memaparkan mesej makluman apabila menatal ke bawah halaman web dan mencapai elemen h1 tertentu. Mereka cuba menggunakan acara tatal() tetapi ia tidak berjaya.

Penyelesaian

Untuk menentukan bila elemen h1 memasuki paparan penyemak imbas, kita perlu mengira offsetnya dari atas dan bandingkan ia dengan nilai skrol semasa. Berikut ialah kod yang disemak:

<code class="javascript">$(window).scroll(function() {
   var hT = $('#scroll-to').offset().top,
       hH = $('#scroll-to').outerHeight(),
       wH = $(window).height(),
       wS = $(this).scrollTop();
   if (wS > (hT+hH-wH) && wS < hT && wS+wH > hT+hH){
       console.log('H1 on the view!'); // or trigger any desired event
   }
});</code>

Penambahan

• Demo Fiddle: Contoh langsung tanpa amaran, sebaliknya pudar dalam elemen h1.
• Kod Dikemas Kini: Sekarang menyemak sama ada elemen berada dalam port pandang, tanpa mengira arah menatal.
• Demo Fiddle Dikemas kini: Menunjukkan kefungsian kod yang dikemas kini .

Atas ialah kandungan terperinci Bagaimana untuk Mencetuskan Peristiwa Apabila Menatal ke Elemen Tertentu dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!