Господа, приветствую.
Не могу победить тривиальную задачу, гугл не помог :( :
Дано: на странице несколько блоков вида
<div id="idXXX"></div>
Задача: при прокрутке страницы , если блок в видимой пользователю части экрана браузера - вызывать скрипт ajax (помечать прочитанным)
Пытаюсь это решить с помощью jquery, не могу победить :( Буду рад помощи, заранее спасибо.
В идеале еще бы так, чтобы второй раз не вызывалась одна и та же функция
Наброски:
function inWindow(s)
{
var scrollTop = $(window).scrollTop();
var windowHeight = $(window).height();
var currentEls = $(s);
var ids=s;
var offset = currentEls.offset();
if(scrollTop <= offset.top && (currentEls.height() + offset.top) < (scrollTop + windowHeight))
{
/*
$.ajax({
url: "status.php?admin='.$admin.'&id=" + ids + "" // не работает
});
*/
console.log("Блок "+ids+" в области видимости");
}
}
$(document).scroll(function ()
{
inWindow("#id1'")
});
$(document).scroll(function ()
{
inWindow("#id2'")
});
$(document).scroll(function ()
{
inWindow("#id3'")
});
$(document).scroll(function ()
{
inWindow("#id4'")
});
$(document).scroll(function ()
{
inWindow("#id5'")
});
.active
{
height:300px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div id="id1" class="active"></div>
<div id="id2" class="active"></div>
<div id="id3" class="active"></div>
<div id="id4" class="active"></div>
<div id="id5" class="active"></div>
Простой
