Здравствуйте. Я на страницу выкладываю ссылки разных музыкальных альбомов (ссылка пробной страницы), но возникает проблема, чем больше будет ссылок тем дольше и тяжелее будет грузится страница. Можно ли сделать так, чтоб информация на странице возникала пошагово, к примеру, при открытии страницы показывалось 5 альбомов, нажимаю на кнопку - следующие 5 и т.д.?
2 ответа
В двух словах это делается так:
$(window).scroll(function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
//Здесь добавляете вашу подгрузку.
}
});
Этот код будет срабатывать каждый раз, когда вы будете доходить до конца страницы. По достижении его грузите, например еще 20 записей.
Только учтите, что первая порция данных должна быть достаточно большой, что-бы появлялся вертикальный скролл.
Так же как рекомендация, сделать такое условие:
$(window).scrollTop() > $(document).height() - $(window).height() - 100
Тогда подгрузка будет происходить не по достижении наименьшей записи, а за 100px до нее, и в итоге у вас не будет эффекта "подергивания" при быстром соединении.
-
-
Нет, это добавляется в код HTML странички, после всего контента. В место: //Здесь добавляете ваш код - добавляете вызов: $.ajax({ url: '/ajax/example.html', //Ваш адрес для подгрузки || dataType : "json", // тип загружаемых данных (можно указать text и просто грузить уже сгенерированный html блок) || success: function (data, textStatus) { || //Здесь просто добавляете data к вашему нижнему блоку через innerHTML например... || } });– Lexd5Commented 10 апр. 2015 в 4:38
-
У меня, уровень в языках программирования практически нулевой, не могли бы вы подсказать где я могу найти контент, который вписываю на страницу WordPress? Я копирую код с сайта deezer и вставляю его на страницу WordPress. Но в какой файл прописывается вставленный код я не знаю. Смотрю в файле /wp-content/themes/mystile/content.php - ничего подобного, что я вставлял на страницу, нет. Смотрю в файле /wp-content/themes/mystile/page.php - тоже нет– zimCommented 10 апр. 2015 в 6:49
Можно даже без нажимания кнопок — просто после прокручивания страницы до конца. Называется Infinity Scroll. Например вот учебное пособие:
http://code.tutsplus.com/tutorials/how-to-create-infinite-scroll-pagination--wp-24873
-
Интересный урок, смотрю что уровень для новичка, постараюсь разобраться. Спасибо!– zimCommented 9 апр. 2015 в 19:09
-
Я заметил что в этом уроке в коде встречается "posts". Я могу этот урок использовать для загрузки информации, которая выложена на одной странице, (не посты) только всплывать она будет при скролинге?– zimCommented 9 апр. 2015 в 20:09