Bagaimana untuk Menentukan Peratusan Tatal Menegak dengan Tepat dalam JavaScript Merentasi Pelayar?

Menentukan Peratusan Tatal Menegak Silang Penyemak Imbas dalam JavaScript

Dalam pembangunan web, selalunya penting untuk memantau kedudukan tatal menegak pengguna. Walau bagaimanapun, mencari kaedah serasi yang tepat dan merentas penyemak imbas boleh menjadi mencabar.

Penyelesaian Silang Penyemak Imbas

Coretan kod yang disediakan menawarkan pendekatan merentas penyemak imbas untuk mengira peratusan skrol menegak:

<code class="javascript">var h = document.documentElement, 
    b = document.body,
    st = 'scrollTop',
    sh = 'scrollHeight';

var percent = (h[st]||b[st]) / ((h[sh]||b[sh]) - h.clientHeight) * 100;</code>

Kod ini boleh dilaksanakan dengan menyimpan HTML dan elemen badan dalam pembolehubah h dan b, bersama-sama dengan nama rentetan untuk scrollTop dan scrollHeight (st dan sh). Peratusan skrol kemudian dikira dengan membahagikan kedudukan skrol menegak semasa dengan ketinggian viewport, diskalakan kepada 100%.

Pelaksanaan jQuery

Bagi mereka yang memilih jQuery, kod berikut boleh digunakan:

<code class="javascript">$(window).on('scroll', function(){
  var s = $(window).scrollTop(),
      d = $(document).height(),
      c = $(window).height();

  var scrollPercent = (s / (d - c)) * 100;
  
  console.clear();
  console.log(scrollPercent);
});</code>

Kaveat

Perlu diingat bahawa penyelesaian ini mungkin tidak mencapai 100% pada penyemak imbas mudah alih moden disebabkan oleh tingkah laku sembunyi automatik UI penyemak imbas.

Atas ialah kandungan terperinci Bagaimana untuk Menentukan Peratusan Tatal Menegak dengan Tepat dalam JavaScript Merentasi Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!