🏃♀️무한스크롤 (Infinity Scroll) UI 구현하기 안녕하세요 TriplexLab 입니다 :) 오늘은 무한스크롤 UI에 관해서 살펴 보도록 하겠습니다. 스크롤이 화면의 끝에 닿기전에 콘텐츠를 추가로 노출시켜 계속 스크롤하게 만드것이 무한스크롤 UI입니다. 보통은 ajax와 같은 서버통신 API를 사용해서 추가로 노출되는 콘텐츠를 로드하지만 본 예제에서는 특정 콘텐츠를 변수에 담고 있다가 데이터가 추가되는 시점에 노출시키는 방식으로 표현해볼 생각입니다. 모바일에서만 국한된 내용으로 오해할 수 있지만 점점 PC웹과 모바일웹의 경계가 모호해지고 있어 PC웹에서도 유용하게 사용 가능합니다. ✨ createDocumentFragment() 메소드 template를 만들어서 뿌리는 과장에서 create..
무한스크롤 (Infinity Scroll) UI 구현하기
🏃♀️무한스크롤 (Infinity Scroll) UI 구현하기 안녕하세요 TriplexLab 입니다 :) 오늘은 무한스크롤 UI에 관해서 살펴 보도록 하겠습니다. 스크롤이 화면의 끝에 닿기전에 콘텐츠를 추가로 노출시켜 계속 스크롤하게 만드것이 무한스크롤 UI입니다. 보통은 ajax와 같은 서버통신 API를 사용해서 추가로 노출되는 콘텐츠를 로드하지만 본 예제에서는 특정 콘텐츠를 변수에 담고 있다가 데이터가 추가되는 시점에 노출시키는 방식으로 표현해볼 생각입니다. 모바일에서만 국한된 내용으로 오해할 수 있지만 점점 PC웹과 모바일웹의 경계가 모호해지고 있어 PC웹에서도 유용하게 사용 가능합니다. ✨ createDocumentFragment() 메소드 template를 만들어서 뿌리는 과장에서 create..
2023.12.10