Показать сообщение отдельно
  #5 (permalink)  
Старый 24.09.2010, 16:58
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

Сообщение от Kostushko Посмотреть сообщение
Подскажите, можно ли запустить функцию по событию, когда нужный элемент виден в окне браузера?
Может быть немного не в тему, но всё же.
Скрипт определяет при каждом (на самом деле не при каждом) "скролле" экрана элементы, находящиеся в зоне видимости пользователя.
Осторожно jQuery:
var timer = 0,
	
	//"самописный" селектор выбирает все элементы на экране, между "верхом" и "низом" 
	//(горизонтаьная прокрутка не учитывается, но можно дописать по-аналогии)
	(function(){
		$.belowthefold = function(element) {
			var fold = $(window).height() + $(window).scrollTop();
			return fold <= $(element).offset().top;
		};

		$.abovethetop = function(element) {
			var top = $(window).scrollTop();
			return top >= $(element).offset().top + $(element).height();
		};
		
		$.inviewport = function(element) {
			return !$.belowthefold(element) && !$.abovethetop(element);
		};
		
		$.extend($.expr[':'], {
			"inViewport": function(a){return $.inviewport(a);}
		});
	})(),
	
	handler = function(){
		var inViewportList = $('div:inViewport');  //набор элементов, видимых в окне браузера
		//делайте с ними что хотите
		//ваш код
	};
	
	
handler();

//вызывает "handler" с задержкой (500 мс) после "каждого скролла"
//если успел прокрутить дальше, то обрабатывается только "второй скролл" и т.д.
//очень удобно - меньше вычислений - меньше нагрузка на браузер
$(window).scroll(function(){
	if(timer){
		clearTimeout(timer);
		timer = 0;
	}
	timer = setTimeout(handler, 500);
});
Ответить с цитированием