Можно создать дубликат:
How to load the web page content based on user scrollingКак загрузить контент, когда пользователь прокручивается до него?
Я делаю один сайт страницы, и я надеюсь добиться эффекта, который вы можете увидеть на http://www.talentgarden.it/it/#!/home где нагрузки содержание, как вы прокрутки вниз. Может ли кто-нибудь сказать мне, как это сделать, и как достичь некоторых эффектов постепенного затухания, которые используются на этом сайте.
Я использую плагин Lazyload для этого. См. Подробности.
http://www.appelsiini.net/projects/lazyload
В вашем примере на странице не загружается, когда пользователь прокручивает. Содержимое фактически скрыто, а затем отображается, когда пользователь прокручивает.
В любом случае, это все о чтении разницы в высоте содержимого и самом окне браузера. Для механизма прокрутки, например, Twitter - Google "Twitter Infinite Scroll".
Пример, например, тот, который вы показываете, - отметьте this JS Bin demo (щелкните рендеринг, а затем проверьте правый верхний угол, вы получите идею). Кроме того, я считаю, что плагин, используемый для этого конкретного сайта, - плагин Lazyload для jQuery. Довольно легко работать, я полагаю; http://www.appelsiini.net/projects/lazyload Задерживает рендеринг изображений, ведьма делает начальное время загрузки немного быстрее.
Хотя ленивая нагрузка может помочь. Я подозреваю, что сайт, с которым вы связались, фактически использует что-то ближе к Scrollorama
Scrollorama предназначен для изменения содержимого (включая показ/скрытие) при прокрутке вниз до него.
Прохладный плагин; это больше похоже на то, что делает Talent Garden на практике. –
[Infinite Scroll] (http://www.infinite-scroll.com/) - популярный плагин для загрузки контента по запросу во время прокрутки. –
Хотя я подозреваю, что они действительно загружают всю страницу в HTML, а затем обнаруживают, где пользователь, когда они прокручивают, чтобы определить, какой контент «раскрыть» дальше. Я считаю, что это отличается от бесконечного прокрутки, но, возможно, нет. –
Пример сайта, который буквально загружает (через Ajax) новый контент в прокрутке: http://www.dazeddigital.com/ Я не думаю, что Talent Garden делает это. –