Check Visibility element viewport or Checking if an element is visible on-screen using jQuery
How to Check an Element is Visible or not Using jQuery?
untuk dapat mengecek apakah element terlihat di layar atau tidak bisa menggunakan jQuery library Element Onscreen Visibility dari om yang dapat anda download di sini.
ingat ini ngecek apakah muncul di layar saat ini, bukan yang tidak muncul di layar… semisal page nya panjang ke bawah dan ada yang tertutupi maka element yg tertutupi di bawah akan bernilai false.
how to use
result akan bernilai true jika element visible (kelihatan) oleh mata user.
$('#element').visible();result akan bernilai true jika bagian dari element visible (kelihatan) oleh mata user.
$('#element').visible( true );Secara default plugin ini akan mengabaikan element dengan css seperti , display:none, visibility: hidden, offsetWidth or offsetHeight is 0 . untuk memfilter css visibility, Anda bisa gunakan jQuery :visible selector
$('#element:visible').visible();Sebagai tambahan, anda bisa meanmbah parameter ke dua yang akan memeriksa apakah elemen visible, serta apakah itu ada dalam viewport (pandangan user) juga.
$('#element:visible').visible( false, true );Tambahan lagi.. Anda bisa menambah parameter ke tiga untuk menentukan arah ketika memeriksa visibilitas. bisa ‘horisontal’, ‘vertikal atau both. Secara default both.
$('#element').visible( false, false, 'horizontal' );supaya lebih paham silahkan lihat demo ini. check visibility element viewport
lihat juga demo implementasi yang ada di qodrbee pada bagian daftar isi
