+
Надоело мучатся с переключателями страниц ?, мы решим эту проблему путем автоматизации авто подгрузки страниц без переходов при скролле страницы вашего сайта.
Код легкий и легко настраивается под любой ваш модуль сайта за основу взят
Каталог файлов, также возможны разные вариации информации кода вывода, ныне предоставлен код вывода Информации об успешной Загрузки страницы и номера текущуй страницы в TITLE браузера.
Функции: 1. Автоподгрузка всех материалов по клику.
2. Адаптивный код можно переделать под любой модуль.
3. 2 варианта переключения Стандарт и Авто по клику.
Установка: 1. В Каталоге файлов заменить BODY на:
Код
<script>o0 = 1000</script>
<span id="kt-num" style="display:none "></span>
<div id="testheight">
<div class="kt-right-container-body">$BODY$<?if($PAGE_SELECTOR$)?><div style="text-align:center;">$PAGE_SELECTOR$</div><?endif?></div>
<div class="kt-right-container-loads"></div>
</div>
2. Добавить кнопку включения Авто подгрузки:
Код
<div class="kt-scroll" title="Автоподгрузка материалов"></div>
3. Добавим .js скрипт:
Код
var ajaxFL = true;
var o8 = location.pathname.split('/')[2];
if(typeof(o8) != 'undefined') {
o9 = o8.split('-')[1]
}
if(typeof(o9) != 'undefined' && o9!=1) {
$('.kt-scroll').hide();
};
$('.kt-scroll').click(function () {
$('.kt-scroll, .pagesBlockuz1').hide();
$('title').text('Бесконечная прокрутка включена!');
setTimeout(function() { $('title').text('Страница загружена'); }, 2000);
$('#kt-load-window').delay(800).fadeOut(500);
var o6 = $('#kt-num').html('1');
function EndlessContent() {
var o1 = window.pageYOffset;
var o2 = $('#testheight')[0].offsetHeight;
var o3 = parseInt(o2)-800;
var o6 = $('#kt-num').html();
if(window.pageYOffset > o3 && o6<o0 && ajaxFL) {
var o4 = $('#kt-num').html();
$('.pagesBlockuz1').hide();
var o5 = parseInt(o4)+parseInt(1);
$('#kt-num').html(''+o5+'');
console.log('Загружен контент '+o5+'-ой страницы');
var o7 = location.pathname.split('/')[1]
ajaxFL = false;
$.get('/'+o7+'/0-'+o5+'', function(data){
$('.kt-right-container-loads').append($('.kt-right-container-body',data).html())
ajaxFL = true;
$('title').text('Страница успешно загружена!');
setTimeout(function() { $('title').text('Страница - '+o5+''); }, 1000);
$('#kt-load-window').delay(800).fadeOut(500);
});
};
};
$(document).scroll(function(){
EndlessContent();
});
});
4. Написать CSS для кнопки подгрузки материала.
При копировании материал указываем источник uCodes.ru
Потестить скрипт вы можете у нас путем нажатия в меню кнопки Авторские Работы - И кликнув иконку в под меню навигации модуля.
Данный раздел авторский все работы являются собственностью ucods.3dn.ru любое коммерческое использование строго запрещено.
При копировании материала указываем источник ucods.3dn.ru
Для редактирования кода необходимо иметь хотя бы базовые знания в HTML, CSS и Js технологиях.
Поделиться новостью в социальной сети.
Добавил: Best_Studio
Дата добавления: 21.12.2015 в 20:03 по МСК
Категория: Каталог файлов
Просмотров: 896
Комментариев: 0
Эмоций:
-
Оценки читателей
ЗАКРЫТЬ
- 0 Лайк
- 0 Лавки
- 0 Ахахах!
- 0 Ого!
- 0 Восторг
- 0 Печаль
- 0 Грусняшь
Добавлять комментарии могут только зарегистрированные пользователи.
[
Регистрация |
Вход ]