Отложенная загрузка контента через div Ajax'ом
Приветствую!
На странице есть контент, который разделен на несколько блоков, заключённых в div, имеющих свой class. После первой загрузки страницы? часть блоков, которые видимы, грузятся Ajax'ом сразу, а остальные блоки, которые находятся за пределами экрана, не должны загружаться. Остальные блоки должны подгружаться по мере видимости при прокрутке скролла вниз или вверх, в зависимости на каком уровне просмотра перезагрузили страницу или открыли новую страницу, заранее за 50px.. В интернетах ничего хорошего не нашел, только плагины для jQuery, но это не подходит, слишком много для этой задачи. Хотелось бы небольшой скрипт на javascript, для решения. Например: в шаблоне есть div <div id="guesslike_div"></div> Применяю такой код: //Подгружает контент внутри div #guesslike_div, если скроллят страницу и элемент попадает в область видимости $(document).ready(function(){ $(window).scroll(function() { //check if your div is visible to user if ($(window).scrollTop() + $(window).height() >= $('#guesslike_div').offset().top) { if(!$('#guesslike_div').attr('loaded')) { //not in ajax.success due to multiple sroll events $('#guesslike_div').attr('loaded', true); $('#guesslike_div').load("/get_guesslike.html", function(){ $(this).show(); }); } } }); }); Но работает этот код нестабильно. При первой загрузке, если блок <div id="guesslike_div"></div>в области видимости, то скрипт его не подгружает, а погружает только если немного прокрутить скролл. А так же, если находишься внизу страницы и перезагрузить страницу, то все блоки, которые находятся в верхней части страницы, за пределами видимости, все загружаются, а так быть не должно, они должны быть в отложенной загрузке. Можете исправить этот скрипт или предложите свой вариант? Хорошим вариантом был бы один общий скрипт, который можно разместить внизу футера, и в div добавлять активный class, для активации функции отложенной загрузки для этого дива, а для вызов Ajax обернуть в функцию этого скрипта. У каждого div свой Ajax, который вызывает свой файл .html с контентом. Заранее спасибо, откликнувшимся! |
|
Часовой пояс GMT +3, время: 14:13. |