약관 클릭 시, 팝업창 띄우기
1-1. 팝업 위드값 지정
1-2. 팝업 위드값 - 반응형 지정
max-width 줘서 이 이상 커지지 않게 한 다음, 반응형!
1-3. 가운데 정렬
1-4. 팝업 숨기기
1-5. 가상선택자
1-6. 약관 클릭 시, 팝업창 띄우기
에러) Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')
script를 body의 상단에 작성하면, html이 로드 되기 전에 script를 먼저 불려지는 경우가 발생! 그러면 addEventListener을 부여할 DOM을 찾지 못하게 되어 에러가 발생.
해결)
-
방법1 - script는 body태그의 가장 아래에 작성한다.
body태그 하단에 js를 작성하면 html이 먼저 로드되고, js 가 그 다음 로드되기 때문에 오류가 발생하지 않는다 -
방법2 - window.onload = function( ){ } 사용한다.
window.onload = function( ){ } 함수는 웹브라우저의 모든 구성요소에 대한 로드가 끝났을 때 브라우저에 의해서 호출되는 함수, HTML을 모두 로드한 뒤에 함수를 호출한다.
https://velog.io/@ahn-sujin/Uncaught-TypeError-Cannot-read-property-addEventListener-of-null
body에 .show 추가된 것 확인
1-7. X 클릭 시, 팝업창 끄기
