Ustawienie scrolla

Question

Witam. Uczę się JS i jQuery. Mam stworzyć stronę internetową i dodałem do  niej scrolla z filmu Pana Mirosława. Mam problem. Jak ustawić tak aby kiedy jesteśmy na początku strony ten scroll znikł a dopiero jak przesuniemy na dół sie pojawił ? Z góry Dziękuje za pomoc.

JS: https://wklej.to/syz4L

HTML: https://wklej.to/ondUQ

CSS: https://wklej.to/f7Q06

Answer 1

Możesz to zrobić za pomocą offset() z JQ. http://api.jquery.com/offset/

Sprawdź położenie elementu od topa poprzez offset().top i zrób sobie z tym co tam chcesz. Tylko żeby to działało przy scrollowaniu to musisz to wrzucić w event .on("scroll") czy tam .scroll().

Comments

dzięki za fatygę ale możesz jaśniej Proszę jestem początkującym :)

---

Za pomocą element.offset().top możesz sprawdzić ile dany element jest "oddalony" od góry.

Jak napiszesz sobie window.offset().top sprawdzisz położenie góry okienka od góry strony, tak łopatologicznie tłumacząc.

Zrób sobie jakąś zmienną np.

var fromtop = window.offset().top;

i później dopisz warunek

Jeżeli odległość wynosi tyle i tyle rób to i to. Np.

if(fromtop > 100) {   /// jesli górna krawędź przeglądarki jest oddalona od początku strony o > 100

 coś tam się dzieje

}  else {

coś tam się dzieje

}

Tylko, żeby to działało podczas scrollowania to musisz obsługiwać listener 'scroll' -> do poczytania tutaj https://developer.mozilla.org/pl/docs/Web/API/Element/addEventListener

W JQ masz element.on("scroll", function(){}) albo element.scroll(function(){})

No i w ten listener upychasz sobie funkcję. Nie chcę pisać wszystkiego wprost, żeby nie podać Ci na tacy rozwiązania tylko zależy mi na tym, żebyś sam popróbował i się nauczył :)