dolte,
1 способ внизу страницы кнопа -- скролим страницу - кнопа видна грузим перед ней контент 2 способ внизу страницы кнопа -- скролим страницу - кнопа видна - жмём кнопу - грузим перед ней контент - грузить нечего - убираем кнопу |
Отошел от того к чему шел.
var request1 = new XMLHttpRequest();request1.open('GET', '/complete/moonbeam-suhov/page1.html');
var request2 = new XMLHttpRequest();request2.open('GET', '/complete/moonbeam-suhov/page2.html');
var request3 = new XMLHttpRequest();request3.open('GET', '/complete/moonbeam-suhov/page3.html');
var request4 = new XMLHttpRequest();request4.open('GET', '/complete/moonbeam-suhov/page4.html');
var request5 = new XMLHttpRequest();request5.open('GET', '/complete/moonbeam-suhov/page5.html');
request1.send(null)
request2.send(null)
request3.send(null)
request4.send(null)
request5.send(null)
var html = document.documentElement;
window.onscroll = function ()
{//Открыли
var element1 = document.querySelector('.ms-showphoto1');
var element2 = document.querySelector('.ms-showphoto2');
var element3 = document.querySelector('.ms-showphoto3');
var element4 = document.querySelector('.ms-showphoto4');
var element5 = document.querySelector('.ms-showphoto5');
var clienth = html.clientHeight;
//var clienthh = document.documentElement.scrollHeight;
//alert(clienthh);
//alert(clienth);
//alert(document.documentElement.scrollTop);
//alert(document.documentElement.scrollHeight);
//alert("Размер вьюпорта: "+ html.clientWidth +"х"+ html.clientHeight);
if (clienth <= 768 )
{
if ($(this).scrollTop() >= clienth + 200 ){element1.innerHTML = request1.responseText;}
if ($(this).scrollTop() >= clienth + 1200){element2.innerHTML = request2.responseText;}
if ($(this).scrollTop() >= clienth + 2200){element3.innerHTML = request3.responseText;}
if ($(this).scrollTop() >= clienth + 3200){element4.innerHTML = request4.responseText;}
if ($(this).scrollTop() >= clienth + 4200){element5.innerHTML = request5.responseText;}
}else{
if ($(this).scrollTop() >= clienth + 100 ){element1.innerHTML = request1.responseText;}
if ($(this).scrollTop() >= clienth + 1200){element2.innerHTML = request2.responseText;}
if ($(this).scrollTop() >= clienth + 2200){element3.innerHTML = request3.responseText;}
if ($(this).scrollTop() >= clienth + 3200){element4.innerHTML = request4.responseText;}
if ($(this).scrollTop() >= clienth + 4200){element5.innerHTML = request5.responseText;}
}
}//Закрыли
вполне работает и на данном этапе устраивает |
Выбросил этот вриант.
Высчитываю положение скролла по другому. Остался вопрос как разделить загрузку, не всё разом, а поэтапно. Прокрутили, подгрузили 1 эллемент Прокрутили, подгрузили 2 эллемент.
var thisPageNum = 1;
var thisWork = 1;
var thisPageNum2 = 2;
var thisWork2 = 2;
function getNextP1(){
if(thisWork == 1 && thisPageNum < 2){thisWork = 0;
$("#upBlock").css('display','block');
$.get("get/get1.php?page="+thisPageNum, function(data){
$("#upBlock").css('display','none');
$("#LoadDiv").html($("#LoadDiv").html()+" "+data);
thisPageNum = thisPageNum + 1;
thisWork = 1;
});
}
}
function getNextP2(){
if(thisWork2 == 2 && thisPageNum2 < 3){thisWork2 = 0;
$("#upBlock").css('display','block');
$.get("get/get2.php?page="+thisPageNum2, function(data){
$("#upBlock").css('display','none');
$("#LoadDiv").html($("#LoadDiv").html()+" "+data);
thisPageNum2 = thisPageNum2 + 1;
thisWork2 = 2;
});
}
}
$(document).ready(function(){
var scrH = $(window).height();
var scrHP = $("#container").height();
$(window).scroll(function(){
var scro = $(this).scrollTop();
var scrHP = $("#container").height();
var scrH2 = 0;
scrH2 = scrH + scro;
var leftH = scrHP - scrH2;
if(leftH < 10){
getNextP1();
getNextP2();
}
});
});
|
| Часовой пояс GMT +3, время: 17:40. |