Отследить окончание скроллинга

10 Dec

Сейчас решаю задачу, для которой важно понять, закончил пользователь скроллировать страницу или продолжает этим заниматься. Если отследить начало скроллинга проблемы не составляет (событие onscroll для нужного элемента), то понять, закончен скроллинг или нет в лоб не получается. В итоге спасает установка и сброс таймера при каждом событии скролла. В моем случае код получился такой:

1
2
3
4
5
6
7
8
9
10
11

var scr_timer = 0;
var scr_delay = 1000; // задержка выполнения одна секунда
 
window.onscroll= function() {
// Функция меняет прозрачность элемента
liRu.gl.appPanel.opacity(':gl_Apps',0.20);
// Сбрасываем таймер
clearTimeout(scr_timer);
// Через секунду после окончания скроллинга возвращаем прозрачность
scr_timer = setTimeout(function(){ liRu.gl.appPanel.opacity(':gl_Apps',1); }, scr_delay);
}

А чтобы не дергать функцию установки прозрачности каждый раз (хотя, конечно, данная функция не такая уж и ресурсоемкая, но на ее месте мог быть любой из нас) можно дописать код таким образом.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

var scr_timer = 0;
var scr_delay = 1000; // задержка выполнения одна секунда
var scr_transp = false;
 
window.onscroll= function() {
// Функция меняет прозрачность элемента
if (scr_transp==false)
{
	liRu.gl.appPanel.opacity(':gl_Apps',0.20);
	scr_transp = true;
}
// Сбрасываем таймер
clearTimeout(scr_timer);
// Через секунду после окончания скроллинга возвращаем прозрачность
scr_timer = setTimeout(function(){ 
		liRu.gl.appPanel.opacity(':gl_Apps',1); 
		scr_transp = false;
	}, 
	scr_delay);
}

No comments yet

Leave a Reply