Inflearn brand logo image

인프런 커뮤니티 질문&답변

samkookji12님의 프로필 이미지
samkookji12

작성한 질문수

3D리플릿 만들기 - 인터랙티브 웹 프로젝트

3D 리플릿 만들기 #6

페이지 클래스리스트 제거 해줬을때

작성

·

63

0

(() => {
	const leaflet = document.querySelector('.leaflet');
	const pagesElem = document.querySelector('.page');
	let pageCount = 0;

	function getTarget(target,className) {
		while (!target.classList.contains(className)) {
			target = target.parentNode;

			if (target.nodeName === 'BODY') {
				return;
			}
		}
		return target;
	}
	leaflet.addEventListener('click', (e) => {
		let pageElem = getTarget(e.target, 'page');
		pageElem.classList.add('page-flipped');
		pageCount++;

		if (pageCount === 2) {
			document.body.classList.add('leaflet-opened');
		}

		let closeElem = getTarget(e.target, 'close-btn');
		if (closeElem) {
			console.log(pagesElem);
			closeElem.classList.remove('leaflet-opened');
			pageElem.classList.remove('page-flipped');
			pageCount = 0;
		}
	});
})();

 

page 첫번째를 선택을 해줘도 close 버튼을 클릭했을때 3번째 페이지의 page-flipped가 제거 되면서 세번째 페이지가 접어 지는데 이유가 뭔가요?

답변

답변을 기다리고 있는 질문이에요
첫번째 답변을 남겨보세요!
samkookji12님의 프로필 이미지
samkookji12

작성한 질문수

질문하기