jquery - cách xác định xem một mục có thể xem/trong cửa sổ/dưới màn hình

Question

với jquery, cách tốt nhất để xác định phần tử dưới màn hình đầu tiên có nghĩa là nó không nằm trong cửa sổ và không hiển thị đối với người dùng?

Cảm ơn

Answer 1

Tôi giả sử bạn đang đề cập đến việc nó có bị cuộn ra ngoài tầm nhìn hay không.

Nếu vậy, hãy thử này:

if($(window).scrollTop() + $(window).height() > $('#my_el').offset().top) { 
    // element is in view 
} 

Ví dụ:http://jsfiddle.net/8x4Zd/

(Nhấp vào bảng kết quả để kiểm tra nếu các yếu tố nhắm mục tiêu là theo quan điểm Sau đó di chuyển xuống và lặp lại..)

Nếu bạn muốn đảm bảo toàn bộ phần tử được hiển thị, hãy thêmcủa nó 210 vào phương trình.

Ví dụ:http://jsfiddle.net/8x4Zd/1/

var win = $(window); 
var el = $('#my_el'); 
var winPos = win.scrollTop() + win.height(); 
var elPos = el.offset().top + el.height(); 

if(winPos > elPos) { 
    // element is in view 
}