За последние 24 часа нас посетили 18927 программистов и 1638 роботов. Сейчас ищут 1742 программиста ...

Как правильно реализовать бесконечную прокрутку

Тема в разделе "JavaScript и AJAX", создана пользователем kiberdemon, 14 дек 2015.

  1. kiberdemon

    kiberdemon Новичок

    С нами с:
    14 дек 2015
    Сообщения:
    7
    Симпатии:
    1
    Доброго времени суток. Есть рабочий код php который генерирует содержимое страницы исходя из переменной
    $page
    полученной get запросом.

    так же есть переменная
    Код (PHP):
    1. $countTopicPerPage = 5 // показывать по 5 новостей 
    далее есть массив с данными ... и исходя из
    1. №страницы ($page) и
    2. количества новостей ($countNewsPerPage)

    генерируется содержимое ... непосредственно html

    Вопрос состоит в том как правильно прикрутить к этому бесконечную прокрутку то есть долистал человек до низа страницы и ему не надо нажимать кнопку
    Код (PHP):
    1. [url="?page=2"]Перейти далее[/url] 
    необходимо что бы содержимое просто подгрузилось ниже.

    Заранее спасибо за пинок в нужную сторону...

    PHP, JavaScript, SQL и другой код пишите внутри тегов
    Код ( (Unknown Language)):
    1. [b]php][/b]Тут код[b][/[/b][b]code][/b][/color]
     
  2. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
  3. Abyss

    Abyss Старожил

    С нами с:
    12 дек 2015
    Сообщения:
    1.298
    Симпатии:
    218
    Адрес:
    Default city
    Смотри на запрос к page.php, если он AJAX
    Код (PHP):
    1. $_SERVER['HTTP_X_REQUESTED_WITH'] 
    То возвращай или json или уже готовую верстку и вставляй javascript'ом в конец документа

    Добавлено спустя 55 секунд:
    Вообще не о том.
     
  4. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
  5. runcore

    runcore Старожил

    С нами с:
    12 окт 2012
    Сообщения:
    3.625
    Симпатии:
    158
    ненавижу бесконечную прокрутку
     
  6. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Я недавно увидел нечто прекрасное. Бесконечная прокрутка, но, внизу блока контента фиксированно висит галочка "отключить прокрутку". Жмакаешь ее, загрузка контента прекращается, рядом с галочкой появляется интерфейс обычного пагинатора. Жмакаешь обратно - интерфейс пагинатора исчезает, и снова можно вечно листать. Это же гениально!
     
  7. Abyss

    Abyss Старожил

    С нами с:
    12 дек 2015
    Сообщения:
    1.298
    Симпатии:
    218
    Адрес:
    Default city
    Я помню в чатике реализовал простую кнопку "загрузить еще" на аяксике и это было удобно.
     
  8. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Это то же, что и автозагрузка. Нет доступа к конкретной странице или возможности прыгнуть на N страниц сразу. Или в конец. Ну ты понял. Возможностей, которые есть у пагинатора, которому тыща лет в обед. И возможность переключения между дозагрузкой и пагинацией - это вот тру.
     
  9. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    Грамотное и современное решение это урлы с пагинацией, реализуемые через пушстейт. И по ссылке можно скакнуть, и поисковикам хорошо и выглядит как инфинит скролл.

    Добавлено спустя 2 минуты 13 секунд:
    Пример: https://discuss.flarum.org/d/187-word-association-game/29

    Добавлено спустя 2 минуты 17 секунд:
    Читать: http://www.sitepoint.com/seo-friendly-infinite-scroll/
     
  10. tuorist

    tuorist Активный пользователь

    С нами с:
    5 фев 2013
    Сообщения:
    113
    Симпатии:
    1
  11. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    У меня всё нормально. Проблемы на вашей стороне: кеш или вирус или антивирус. Кто-то подсовывает сертификат.

    Добавлено спустя 1 минуту 13 секунд:
    [​IMG]
     
  12. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Неплохо. Подтормаживает при прокрутке вверх даже, правда. Но, в целом круто.
     
  13. tuorist

    tuorist Активный пользователь

    С нами с:
    5 фев 2013
    Сообщения:
    113
    Симпатии:
    1
    Проблема, видимо, в браузере, но не кеше. SRWare Iron то же самое выдает, что и гугл хром. А в лисе все нормально, значит доквеб ни причем.
    Давно ищу причину тормозов в гугл хроме, все сетевые советы перебрал. Я по удалял везде где нашел хромовскою папку апдейт, может в этом дело?
     
  14. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    я бы сильно испугался если бы увидел, что два хромиум браузера имеют проблемы с сертификатом. один движок, значит одинаково уязвимы.
     
  15. tuorist

    tuorist Активный пользователь

    С нами с:
    5 фев 2013
    Сообщения:
    113
    Симпатии:
    1
    Удаленные мной папки не могут быть причиной проблемы с сертификатом?
    А зачем пугаться если сам браузер блокирует ресурс, при этом сообщает что сделал это во избежания проблем.
     
  16. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Потому что причину такого поведения, когда у ресурса все хорошо, тебе уже описали. Значит что-то пропихивает левые сертификаты. Проверься на руткиты.

    Ну и да, переустанови браузеры начисто.
     
  17. mahmuzar

    mahmuzar Старожил

    С нами с:
    6 апр 2012
    Сообщения:
    4.631
    Симпатии:
    425
    Адрес:
    РД, г. Махачкала.
    А никого не раздражает это подтармаживает? Меня сильно)

    Добавлено спустя 4 минуты 6 секунд:
    https://yadi.sk/i/qsPCSIXGmJZK6
    а если у человека комп слабее?)
     
  18. tuorist

    tuorist Активный пользователь

    С нами с:
    5 фев 2013
    Сообщения:
    113
    Симпатии:
    1
    Удалил гугл хром.
    Проверил на руткиты док.веб.
    Скачал утилиту каспер., проверил на руткиты.
    Все чисто.
    Установил гугл хром.
    В настройках док.веб указал:
    Настройки-Основные-Сеть-Безопасные соединения:
    Проверять зашифрованный трафик - Откл.
    Зашел https://discuss.flarum.org/d/187-word-association-game/29, результат тот же что и был ...Сообщение браузера:
    Понятно что где то происходит подмена... Как найти? Где еще искать?
    Закладки гугл хрома не могут влиять?

    Проверил еще McAfee, результат:
     
  19. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Есть такое, но, сдается мне, это можно легко оптимизировать.
    Арту, дай угадаю, генерация урла в строке происходит по событию onscroll?
     
  20. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    не я автор. я просто разместил объяву.

    очередная "страничка" подгружается не моментально. оптимизировать скорость можно за счет памяти. нувыпоняли.
    на мобилке работает нормально, значит требования не сильно жесткие.

    Добавлено спустя 4 минуты 48 секунд:
    кстати, перетаскиванием "скроллера" справа пользовались или только стрелками?
     
  21. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Среднюю кнопку мыши зажимал и водил курсором. Только так и скроллю уже много лет.

    Добавлено спустя 49 секунд:
    Это не избавит от тормозов, которые случаются при скролле наверх. А они есть даже в таком случае.

    А вот если обновление адресной строки отвязать от onscroll и перевязать на nextframe, то бишь связать с фреймрейтом браузера, с проверкой, сколько времени прошло с последнего вызова, то тормоза исчезнут. А сейчас они генерятся от того, что во время скроллинга браузер, на мощном компе, успевает сгенерить миллион вызовов Onscroll и засрать ими стек вызовов до отказа, после чего идут параллельно реджекты и попытки разгрузки стека.

    Что характерно - на мобилах, как ты сам сказал,скорее всего работает нормально, там процы послабее, и браузер не может генерить события таким же потоком.

    Сопоставление адресной строки и скролла - фоновая задача, по факту. В браузерном JS такие вещи решаются привязкой ко времени исполнения самого браузера, а не к событиям контроллов.
     
  22. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    нет разницы наверх или вниз. внезапно.

    Добавлено спустя 53 секунды:
    сперва добейся, потом поучай.
     
  23. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Вот именно, вверх тормозит так же как и вниз. Хотя ничего при этом не грузится.
    Я бы понял тормоза при прокрутке вниз. Но при прокрутке вверх - впервые вижу подобное.
     
  24. artoodetoo

    artoodetoo Суперстар
    Команда форума Модератор

    С нами с:
    11 июн 2010
    Сообщения:
    11.116
    Симпатии:
    1.244
    Адрес:
    там-сям
    да сфигали ничего не грузится-то, Фел!? ты по ссылке прыгнул на страницу 29. у тебя есть куда идти и вперед и назад. оно НЕ загружено пока.

    ты ожидал, что первые 29 страниц сразу загружаются. окай, а если это 10050029-я страница?

    Добавлено спустя 1 минуту 3 секунды:
    Еще почитать: http://searchenginewatch.com/sew/how-to/2392566/10-essentia ... ite-scroll
     
  25. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.771
    Адрес:
    :сердА
    Я специально перешел на страницу 1. Прокрутил вниз. Начал возвращаться наверх. Тормозит.