웹솔루션개발 22년 노하우! 해피CGI의 모든것

버튼 클릭시 확인용 모달 팝업창이 출력됩니다. 자바스크립트 소스입니다. 클릭시 모달 팝업 영역에 클래스를 삽입합니다. css로 모달 팝업창을 보이게 디자인 합니다. 첨부파일 다운로드 또는 해당 사이트에서 전체 소스를 확인할 수 있습니다.

다운로드 받은 파일의 압축을 해제한 뒤, example/index.html 파일을 웹브라우저로 열어보면 데모 확인이 가능합니다. 화면에 보라색으로 표시되는 동그라미가 표시가 되고, 보라색 버튼을 클릭하면 위 그림 처럼 클릭했던 동그라미 주변에 방사형으로 메뉴가 펼쳐지게 됩니다. 펼쳐진 메뉴에 버튼을 선택해서 클릭시에는 위 그림 처럼 어떤 메뉴를 클릭했는지를 경고창이 뜨네요. 사용방법은 아래와 같습니다.

위의 이미지를 보시면 기능 확인이 바로 되실 겁니다. 소스 적용도 간단합니다. var popbox = new Popbox({ blur:true, overlay:true, }); 위의 스크립트와 Popbox content 1 Close Popbox content 2 Close Main content of the page Open mypopbox 1 Open mypopbox 2 &nbsp 위의 기본 HTML 을 참고하시면 되겠습니다.