1. 스크롤이벤트리스너 안의 코드는 1초에 60번 이상 실행됩니다.
그래서 스크롤 이벤트리스너는 많이 달면 성능저하가 일어나니 스크롤바 1개마다 1개만 씁시다.
2. 스크롤이벤트리스너 안의 코드는 1초에 여러번 실행되다보니 바닥체크하는 코드도 여러번 실행될 수 있습니다.
숙제2에서 alert가 2번 뜨고 그럴 수 있다는 뜻입니다.
그걸 방지하고 싶으면 구글에 검색해보는 것도 나쁘지않습니다. 변수같은걸 활용하면 됩니다.
$('.lorem').on('scroll', function() {
var 스크롤양 = document.querySelector('.lorem').scrollTop; //div의 스크롤바 내린양
var 실제높이 = document.querySelector('.lorem').scrollHeight; //div의 실제 높이
var 높이 = document.querySelector('.lorem').clientHeight; //눈에보이는 div박스 높이
var 여유 = 10
var scrolled = false;
if(스크롤양 + 높이 >= 실제높이 - 여유 && !scrolled ) {
alert('내용의 마지막입니다.')
scrolled = true;
}
});
위 질문통해서 제가 작성한 코드인데 계속 중복으로 alert창이 뜹니다.. 문제점이 뭘까요ㅜ
