[CSS][JavaScript] Opóźnienie działania skryptu, dopiero gdy będzie widoczny Opcje

[artekp999]

Witam, mam taki mały problem z którym sobie nie potrafię poradzić.

Wykorzystałem sobie takie animowane paski
http://codepen.io/tamak/pen/hzEer

Ładują się one od razu po wczytaniu strony więc umieszczając je gdzieś na dole strony zanim tam ze scrolluje są już załadowane wiec nie widać efektu animacji.
Chciałbym zrobić tak aby ten skrypt zaczął działać dopiero działać jak użytkownik będzie widział do na ekranie.

[session]

Waypoints

Możesz również napisać to w kilku linijkach korzystając z jQuery:

1. Sprawdzasz pozycję elementu .offset()
2. Wysokość ekranu $(window).height()
3. Położenie scrolla $(document).scrollTop()
4. if 1 < (2+3) startujesz animację, bo dolna krawędź okna przeglądarki przekroczyła miejsce w którym zaczyna się element, możesz też do 1 dodać jego wysokość wtedy rozpocznie się, gdy cały element będzie widoczny

to wszystko w jakimś eventListener, np: .scroll()

Ten post edytował session 2.11.2015, 11:35:55

[artekp999]

ok, dzięki za pomoc

sam sobie to napisałem w jQuery i wszystko działa