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

css 만으로 구현되어 있습니다. 팝업출력시 스케일이 변경되며 펼쳐지는 효과가 있습니다 마찬가지로 팝업을 닫을때도 스케일이 변경되며 사라집니다.

popModal은 jQuery 플러그인을 이용하여 ​툴팁, 제목, 모달, 대화상자, 확인 팝업 모달을 만들수 있습니다 1.jQuery 가 필요 합니다. 2.css 와 popModal.min.js 파일을 호출하세요. 3.버튼을 생성하여 모달 클릭할 준비하세요. 4.버튼을 클릭하면 생성될 모달을 만들어주세요. 위의 방법이 기본적인 모달 생성 방법 입니다. 다양한 옵션이 존재 하네요. 유의사항 popModal 을 이용하여 동적모달을 생성할 수 있습니다. 하지만 로컬 형태에서는 작동하지 않으니 웹에서 테스트 해 보셔야 합니다. 그리고 라이센스는 MIT 라이센스 입니다. ​

Modally 는 디자인 작업이 쉽도록 구성되어 있습니다. 가벼운 jQuery 플러그인으로 중첩 모달을 생성 할 수 있습니다. 중첩모달이란? ( 모달에서 또 다시 모달을 여는 것을 뜻합니다. ) 플러그인 작동을 사용자 정의하기위한 일부 구성 옵션이 제공됩니다. 사용자 정의 너비 및 CSS 스타일을 설정할 수 있습니다.플러그인에는 jQuery를 제외한 다른 외부 라이브러리가 필요하지 않습니다. 라이센스는 MIT 라이센스 입니다.

안녕하세요 모달을 이용하여 Alert, Confirm 창을 많이들 사용하고 있으시죠? JQuery 를 이용하여 쉽게 Alert, Confirm, Window 창을 생성할 수 있는 자료를 소개해 드릴까 합니다. ^^; 압축파일을 다운로드 받으시면 test.html 파일을 만들어 두었습니다. ( 원자료의 사이트에서는 샘플 파일을 제공하지 않아서 만들어서 첨부했어요 ^^ ) 스타일을 호출해 주세요. 모달창의 크기 및 레이아웃 관련 스타일 입니다. 스크립트를 호출합니다. 본문을 구성 합니다. 버튼 생성이라 보시는게 맞을듯 합니다. 모달창을 셋팅 합니다. var dialogManager = new DialogsManager.Instance(); //Instance 생성합니다. 한페이지에 1개의 Instance 만..

이미지 갤러리 게시판에 사용하면 좋을듯 한 무료 소스를 안내 드릴까 합니다. 소스는 생각보다 심플하며 간단하구요. 여러가지 옵션을 제공하기 때문에 사용이 편리 합니다. head 태그에 아래의 스크립트를 포함 시키세요. head 태그에 아래의 스타일을 포함 시키세요. 링크에 반드시 swipebox Class 명을 사용하세요 소스 코드의 밑 부분에서는 스크립트를 실행 시키세요.$ ( ' .swipebox ' ). swipebox (); 위의 코드를 모두 합치면 아래의 코드처럼 됩니다. ^^

위와같은 기본 형태부터 팝업의 위치를 변경할 수 있는 이벤트 배경색상을 원하는 색상으로 변경하는 이벤트 등 다양한 효과를 가진 레이어형 팝업입니다. jquery 1.4.3 이상으로 선언하셔야만 작동이 가능하며, 이벤트 별 자세한 jquery 문법은 홈페이지에서 확인하시기 바랍니다.^^