Показать сообщение отдельно
  #1 (permalink)  
Старый 17.12.2016, 13:50
Аватар для Black_Star
Профессор
Отправить личное сообщение для Black_Star Посмотреть профиль Найти все сообщения от Black_Star
 
Регистрация: 11.07.2016
Сообщений: 292

Скролл элемента .scroll() + событие
Добрый день уважаемые. Появилась необходимость задать элементу событие при его скроллинге, а точнее когда пользователь не видет элемента прокручивая страницу. Вроди бы детский вопрос, но я где-то недопонимаю.
Приведу пример
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<style type="text/css">

.field{
	border: 1px solid #000;
	width: 800px;
	height: 1800px;
}

	.block{
		margin: 10%;
		width: 50px;
		height: 50px;
		background-color: red;
	}
</style>
<body>
	<div class="field">		
	<div class="block"></div>
	</div>
</body>
	<script type="text/javascript">
		
	window.onload = function () { 


$("body").scroll(function() {

 var coord = $('.block').offset().top;

if ($('.block').offset().top == 0) {
		
		console.log("Елемента больше не видно в браузере");
	}
else {
	console.log("Елемент снова в браузере виден");
}

});

	}
	</script>
</html>

Почему оно не срабатывает? Мне необходимо что б при исчезновение нижней грани элемента из области видимости отписывало сообщение в консоль, при появлении отписывало второе сообщение
Ответить с цитированием