Я застрял с функцией загрузки jquery.Я хочу сделать бесконечную страницу прокрутки с загрузкой контента с других страниц.Но как я прокручиваю, jquery load ();Функция выполняется правильно только один раз.В определенной точке прокрутки триггера он загружает содержимое со следующей страницы.Но когда я прокручиваю до точки запуска следующего загруженного контента, он просто загружает новый контент при каждом событии прокрутки, поэтому он загружает следующий контент каждую миллисекунду.Я просто не могу понять, где проблема и как заставить ее работать должным образом.Может быть, мой вопрос нуби, но я действительно нигде не могу найти решение.Заранее спасибо!
Вот ссылка на страницу, над которой я работаю: http://viimiracula.ru/russian/aboutnew/about.htm
Вот скрипт:
$( window ).load(function() {
$. AjaxSetup ({// Отключить кеширование AJAX кеш ответов: false});
//VARS
var currentcontentid = parseInt($("div.content").attr('id').replace(/content/, '')),
nextcontentid = parseInt(currentcontentid) + 1,
previouscontentid = parseInt(currentcontentid) - 1,
currentContent = $('#content' + currentcontentid),
nextContent = $('#content' + nextcontentid),
$window = $(window),
fired = 0;
var pages = ['about.htm','architectural-concrete.htm','artists.htm','calculate-production.htm','classifier1.htm','classifier2.htm','decorative-concrete.htm','learnsculpture.htm','manufacturing-technology.htm','service.htm','technical-characteristics.htm','tips-to-new-customers1.htm','tips-to-new-customers2.htm'];
var nextpageurl = pages[nextcontentid];
var contentOffset = $('#content' + currentcontentid).offset().top;
var contentHeight = $('#content' + currentcontentid).height();
var windowHeight = $window.height();
var triggerHeight = contentOffset + contentHeight - windowHeight;
var marginOldContent = contentOffset + contentHeight;
var fired = 0;
//Loaded content margin
$('.content').css('height', windowHeight);
$('head').append('<style>#content' + nextcontentid + '{margin-top:' + windowHeight + 'px;}</style>');
//Load on scroll function
$(window).on('scroll',function() {
var scroll = $window.scrollTop();
var triggerHeight = contentOffset + contentHeight - windowHeight;
$('.scroll3').html(scroll);
$('.scroll2').html(triggerHeight);
if (scroll >= triggerHeight){
var urlPath = "/russian/aboutnew/" + nextpageurl;
$("body").append('<div class="content" id="content' + nextcontentid + '"></div>');
$("#content" + nextcontentid).load("/russian/aboutnew/" + nextpageurl + " .content");
$('#content' + currentcontentid).css('margin-top', - marginOldContent);
$('#content' + currentcontentid).css('position', 'fixed');
//Previous content fade out
var header = $('#content' + currentcontentid);
var range = 200;
$(window).on('scroll', function () {
var scrollTop = $(this).scrollTop(),
height = header.outerHeight(),
offset = height / 2,
calc = 1 - (scrollTop - offset + range) / range;
header.css({ 'opacity': calc });
if (calc > '1') {
header.css({ 'opacity': 1 });
} else if ( calc < '0' ) {
header.css({ 'opacity': 0 });
}
});
//Changing URL
window.history.pushState("object or string", "Title", urlPath);
//Changing Title
$.ajax({
url: urlPath,
dataType: 'html',
success: function(html) {
$('.scroll').text(html);
var title = $('.scroll').text($(html).filter('title').text());
document.title = $('.scroll').html();
}
});
currentcontentid = currentcontentid + 1;
nextcontentid = nextcontentid + 1;
nextpageurl = pages[nextcontentid];
contentOffset = $('#content' + currentcontentid).offset().top;
contentHeight = $('#content' + currentcontentid).outerHeight( true );
windowHeight = $window.height();
triggerHeight = contentOffset + contentHeight ;
$('.scroll3').html(scroll);
$('.scroll2').html(triggerHeight);
};
/*if ($window.scrollTop() >= menudistance - 70) {
$('.submenupage2').css('position','fixed');
$('.submenupage2').css('top','70px');
}else{
$('.submenupage2').css('position','static');
$('.submenupage2').css('top','70px');
}
$(window).on("scroll", function() {
var scrollHeight = $(document).height();
var scrollPosition = $(window).height() + $(window).scrollTop();
if ((scrollHeight - scrollPosition) / scrollHeight === 0) {
$('.submenupage4').css('position','static');
}
});*/
});
});