+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: Ładowanie strony "na raty" (/thread-%C5%82adowanie-strony-na-raty)
Ładowanie strony "na raty" - komanch - 01-06-2014
Na wstępie powiem, ze nie znam się na tworzeniu stron www, prostą stronę na której zamieszczam swoje prace fotograficzne w formie miniatur powiększających się po ich kliknięciu, zrobiłem przy pomocy FrontPage'a i jestem całkowicie zadowolony. Jednak z czasem apetyt rośnie i chciałbym swojej stronie "zaimplementować" coś (nawet nie wiem jak to nazwać) co pozwoliłoby na jej otwieranie jakby "na raty", czyli nie od razu wszystkie miniatury zdjęć mają się pojawić, załadować, a dopiero kiedy zjedzie się na dół strony ma się ładować kolejna ich cześć i tak dalej ...
Najlepiej jeśli pokażę przykład o co mi chodzi, na tej stronie kolejna cześć miniatur pojawia się dopiero gdy przejdzie się na koniec danej części miniatur (co łatwo zauważyć po coraz mniejszym bocznym pasku):
http://1x.com/photos/latest/all
Możecie mi powiedzieć jak osiągnąć taki efekt? czy da się to zrobić prosto? może jest jakiś gotowy script?
RE: Ładowanie strony "na raty" - Kartofelek - 01-06-2014
To coś o czym mówisz zwie się "infinite scroll gallery". Czy jest łatwe do zaimplementowania? Jak umiesz używać bazy danych, php i js to jest bardzo proste. Jak nie, to będziesz musiał sobie poczytać. Jak w necie poszukasz "jquery infinite scroll gallery tutorial", to wyskoczy ci trochę linków. Tradycyjnie sporo kiepskich, ale ogólne założenia można zobaczyć.
Na szybko kilka ciekawszych:
http://www.1stwebdesigner.com/tutorials/infinite-scrolling-tutorial/ - tutorial
http://www.dotnetbull.com/2013/05/browser-scroll-to-end-of-page-in-jquery.html - tutaj jest ładne podejście, ale musisz trochę ogarniać
Ogólnie poszukaj "jquery infinite scroll gallery tutorial"
Masz też drugą możliwość - wykorzystanie lazyload http://www.appelsiini.net/projects/lazyload
Ta metoda działa na nieco innej zasadzie. Zamiast pobierać obrazki z serwera i je dorzucać na koniec strony, wszystkie obrazki od razu wrzucasz w kod strony, ale ładowanie ich zacznie się dopiero gdy użytkownik przewinie stronę tak by znalazły się na ekranie. Do obrazków bardzo dobra i łatwa metoda, a i nie wymaga żadnego php czy bazy.