윈도우 이벤트

윈도우 이벤트

윈도우 이벤트는 윈도우 객체만 사용할 수 있는 이벤트가 아니라 window 객체와 document 객체 이외에 img 태그 등이 사용할 수 있는 이벤트

이벤트	설명
ready	문서 객체가 준비 완료되면
load	문서 객체를 불러들일 때 발생합니다
unload	문서 객체를 닫을 때 발생합니다
resize	문서 객체의 크기를 변화시킬 때 발생합니다
scroll	문서 객체를 스크롤할 때 발생합니다.
error	에러가 있을 때 발생합니다

window 객체에 scroll 이벤트를 연결. 

window 객체는 별도의 선택자가 없으므로, 곧바로 문서 객체를 넣는다는 것을 주의한다.

$(document).ready(function() {
	$(window).scroll(function() {
		var scrollHeight = $(window).scrollTop() + $(window).height();
		var documentHeight = $(document).height();

		if (scrollHeight == documentHeight - 200) {
			for (var i = 0; i < 10; i++) {
				$('<h1>Infinity Scroll</h1>').appendTo('body');
			}
		}
	});
});

$(document).height() - 문서 전체의 높이

$(window).scrollTop() : 현재 창 위에 있는 스크롤된 창의 높이

$(window).height() : 현재 창의 높이

스크롤이 끝까지 도달한 코드

$(document).height() === $(window).scrollTop() + $(window).height();