Jak określić wysokość i pozycję przewijania okna w jQuery?

179

Muszę chwycić wysokość okna i przesunięcie przewijania w jQuery, ale nie miałem szczęścia znaleźć tego w dokumentach jQuery lub Google.

Jestem w 90% pewien, że istnieje sposób na uzyskanie dostępu do wysokości i scrollTop dla elementu (przypuszczalnie łącznie z oknem), ale po prostu nie mogę znaleźć konkretnego odniesienia.

javascript jquery

— Jedna kredka
źródło

2

A może bez jQuery?

— Costa

@Costa To prawdopodobnie zostało zadane gdzie indziej na StackOverflow, a jeśli nie, to zasługuje na własne pytanie.

— Jedna kredka

296

Z jQuery Docs:

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

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

— Pim Jager
źródło

1

Liczby, których właśnie przegapiłem w dokumentach; przeszukałem ich, ale ich organizacja szczerze mówiąc nie ma dla mnie sensu (chyba nadal myślę w Mootools). Dzięki!

— One Crayon

To nie działa w żadnej przeglądarce dla jQuery 1.3.2, chociaż podobno zostało dodane we wcześniejszej wersji. Albo to, albo mam coś nie tak z moim kodem tutaj

— Philluminati,

11

$ (window) .height () podaje rzutnię wysokości, a nie wysokość przewijania. $ (document) .height () podaje rzeczywistą wysokość zwoju, jak sugerowała Aidamina.

— Jonathan

Często jestem zdumiony, jak wiele pozytywnych opinii takich jak ta przyciąga, ale ponieważ już dwa razy w tym tygodniu szukałem tego, mam kolejne +1

— Neil

41

ze strony http://api.jquery.com/height/ (Uwaga: Różnica między użyciem okna i obiektu dokumentu)

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

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

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

— Aidamina
źródło

8

Pure JS

window.innerHeight
window.scrollY

jest ponad 10 razy szybszy niż jquery (a kod ma podobny rozmiar):

Tutaj możesz wykonać test na swoim komputerze: https://jsperf.com/window-height-width

— Kamil Kiełczewski
źródło

window.scrollY, pobierz przewiń górną wysokość

— xgqfrms

6

$(window).height()

$(window).width()

Dostępna jest również wtyczka do jquery do określania położenia elementu i przesunięć

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

przewijanie offset = właściwość offsetHeight elementu

— Joey V.
źródło

1

Dzięki, Joseph. To nie jest dokładnie to, czego szukałem, ponieważ starałem się uniknąć używania innej wtyczki, ale sprawiłeś, że szukałem we właściwym kierunku. W końcu okazuje się, że tak naprawdę potrzebowałem „$ (okno) .scrollTop ()”, aby dowiedzieć się, ile strony przewinęło się poza okienkiem ekranu, aby odpowiednio dopasować elementy.

— DA.

0

Jeśli potrzebujesz przewinąć do punktu elementu. Możesz użyć funkcji Jquery do przewijania w górę / w dół.

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

— dush88c
źródło