본문 바로가기

DEVELOP

[javascript] window 팝업 띄우기 스크립트

728x90

* ES6 script 문법을 사용하였습니다.

marketing-agree-more 클래스 명을 가진 자세히보기 버튼을 클릭시 크기 커스텀된 윈도우 팝업 오픈하기.

 

html

<p class="tit-gray">서비스 및 상품 추천, 각종 이벤트 소식을 받습니다.&ensp;
<u class="marketing-agree-more">자세히보기&ensp;&gt;</u></p>

 

javascript

const marketingBtn = document.querySelector('.marketing-agree-more');
marketingBtn.addEventListener('click', () => {
	const maketingPopup = window.open('mypage_member02_marketing_agree_popup.html', '_blank',
'width=583, height=816');
	maketingPopup.onload;
});

해당 자세히보기 버튼 엘리먼트를 marketinBtn이라는 변수에 저장하고, addEventListner로 클릭 이벤트를 연결하여 실행한다.

window.open('오픈하려는 윈도우 팝업 파일 경로', '바로 열경우 _self, 새 창으로 열경우 _blank', '원하는 윈도우 팝업 width와 height');