masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > HTML页面滚动时获取离页面顶部的距离2种实现方法_javascript技巧

HTML页面滚动时获取离页面顶部的距离2种实现方法_javascript技巧

WBOY
Lepaskan： 2016-05-16 17:23:18
asal
1266 orang telah melayarinya
方法一：DOM
复制代码 代码如下:

<script> <BR>window.onscroll = function() { <BR>console.info(window.scrollY); <BR>} <BR></script>

注册onscroll事件，在控制台（按F12）打印当前页面距离页面顶部的距离（单位：像素px)

方法二：jQuery
复制代码 代码如下:

$(function() {
$(window).scroll(function() {
console.info($(window).scrollTop());
});
});

调用window对象的scroll方法注册滚动事件，调用window对象的scrollTop方法，意义同scrollY属性。
Label berkaitan：
Menatal halaman
sumber：php.cn
Artikel sebelumnya：JSON序列化与解析原生JS方法且IE6和chrome测试通过_javascript技巧 Artikel seterusnya：JavaScript判断密码强度(自写代码)_javascript技巧
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Isu terkini
Halaman tiba-tiba tidak dapat menarik css atau bootstrap Jadi saya sedang membangunkan halaman, saya telah membuat sebahagian daripadanya semalam d...
daripada 2024-04-06 21:58:04
0
1
800
Bagaimana untuk membuat elemen terapung disusun secara menegak dan bukannya secara mendatar dalam CSS? Saya cuba membuat halaman web dengan dua lajur, dengan kandungan utama di satu pihak dan k...
daripada 2024-04-06 20:45:26
0
2
386
Bagaimana untuk menyelesaikan ruang kosong misteri di bahagian bawah halaman dalam CSS Saya cuba membina halaman web mudah menggunakan Bootstrap dan D3, tetapi saya tidak tahu b...
daripada 2024-04-06 20:22:15
0
1
454
Laravel 8 - Cara mengubah hala /{editable_text} laluan ke /{user} route Saya telah cuba membuat laluan ubah hala untuk membawa saya ke profil pengguna. Laluan uba...
daripada 2024-04-06 17:26:11
0
1
410
untuk gelung secara rawak pergi dari 1 hingga 0 Pada asasnya, setiap kali halaman dimuat semula, gelung for berpotensi berubah daripada 1 ...
daripada 2024-04-06 16:48:14
0
1
393
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan