Làm cách nào để xác định chiều cao và vị trí cuộn của cửa sổ trong jQuery?

179

Tôi cần lấy chiều cao của cửa sổ và phần bù cuộn trong jQuery, nhưng tôi không có may mắn tìm thấy điều này trong các tài liệu jQuery hoặc Google.

Tôi chắc chắn 90% có một cách để truy cập chiều cao và scrollTop cho một phần tử (có lẽ bao gồm cả cửa sổ), nhưng tôi không thể tìm thấy tài liệu tham khảo cụ thể.

javascript jquery

— Một bút chì màu
nguồn

2

Làm thế nào về việc không có jQuery?

— Costa

@Costa Điều đó có thể đã được hỏi ở nơi khác trên StackOverflow, và nếu không nó xứng đáng là câu hỏi của riêng nó.

— Một Crayon

296

Từ tài liệu jQuery:

const height = $(window).height();
const scrollTop = $(window).scrollTop();

http://api.jquery.com/scrollTop/
http://api.jquery.com/height/

— Pim Jager
nguồn

1

Hình tôi chỉ bỏ lỡ nó trong các tài liệu; đã tìm kiếm họ, nhưng tổ chức của họ thẳng thắn không có ý nghĩa gì với tôi (tôi vẫn nghĩ trong Mootools, tôi cho rằng). Cảm ơn!

— Một Crayon

Điều này không hoạt động trong bất kỳ trình duyệt nào cho jQuery 1.3.2 mặc dù nó được cho là đã được thêm vào trong phiên bản trước. Hoặc là tôi hoặc có gì đó không đúng với mã của tôi ở đây

— Philluminati

11

$ (window) .height () cung cấp chế độ xem chiều cao chứ không phải chiều cao cuộn. $ (tài liệu) .height () cho chiều cao cuộn thực, như Aidamina đề xuất.

— Jonathan

Tôi thường ngạc nhiên về số lượng những thứ đơn giản như thế này thu hút, nhưng vì tôi đã xem nó hai lần trong tuần này, nên có thêm +1

— Neil

41

từ http://api.jquery.com/height/ (Lưu ý: Sự khác biệt giữa việc sử dụng cho cửa sổ và đối tượng tài liệu)

$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document

từ http://api.jquery.com/scrollTop/

$(window).scrollTop() // return the number of pixels scrolled vertically

— Aidamina
nguồn

8

Tinh khiết

window.innerHeight
window.scrollY

nhanh hơn gấp 10 lần so với jquery (và mã có kích thước tương tự):

Tại đây bạn có thể thực hiện kiểm tra trên máy của mình: https://jsperf.com/window-height- thong

— Kamil Kiełczewski
nguồn

window.scrollY, nhận chiều cao cuộn cao nhất

— xgqfrms

6

$(window).height()

$(window).width()

Ngoài ra còn có một plugin để jquery để xác định vị trí phần tử và offset

http://plugins.jquery.com/project/dimensions

cuộn offset = offsetHeight thuộc tính của một phần tử

— Joey V.
nguồn

1

Cảm ơn, Joseph. Đó không phải là chính xác những gì tôi đang tìm kiếm vì tôi đang cố gắng tránh sử dụng một plugin khác, nhưng bạn đã cho tôi tìm kiếm đúng hướng. Cuối cùng, hóa ra thứ tôi thực sự cần là '$ (cửa sổ) .scrollTop ()' để tìm ra số lượng trang đã cuộn qua chế độ xem để điều chỉnh các yếu tố phù hợp.

— DA.

0

Nếu bạn cần cuộn đến một điểm của một yếu tố. Bạn có thể sử dụng chức năng Jquery để cuộn nó lên / xuống.

$('html, body').animate({
                scrollTop: $("#div1").offset().top
            }, 'slow');

— dush88c
nguồn