[해피CGI][cgimall] jquery Colorbox Ver1.6.4

* Colorbox License

   - MIT License


* Colorbox 소개

   - 사진, 그룹화, 슬라이드 쇼, 아약스, 인라인 및 아이프레임 콘텐츠를 지원합니다.
   - 경량 : 10KB의 JavaScript (gzipped 5KB 미만).
   - CSS를 통해 제어되므로 스타일을 다시 지정할 수 있습니다.
   - 소스 파일을 변경하지 않고 콜백 및 이벤트 훅으로 확장 할 수 있습니다.
   - JS에 설정되며 기존 HTML을 변경하지 않아도됩니다.
   - 이미지를 사진 그룹에 미리로드합니다.



* Colorbox 사용방법

첨부된 압축파일을 해제하여 원하는 경로에 업로드합니다
jquery , colorbox  js파일과 css 파일을 경로에 맞게 불러옵니다

 

 

라이트 박스 레이어 팝업 이미지를 보여주기 위한 
스크립트를 호출을 아래와 같이 group1 로 선언 및 html 코드를 작성합니다

 

 

 

 

위와 같이 테스트할만한 샘플코드를 작성후 디자인을 어느정도 정리한후
웹페이지에서 실행을 하면 아래와 같은 이미지 팝업을 확인하실 수 있습니다

 

 

* Settings

transition : 전환유형을 설정 "elastic", "fade" , "none" 으로 설정 가능합니다
speed : 페이드 및 전환 속도를 밀리 초 단위로 설정 가능합니다
href : URL 주소 링크를 걸수 있습니다
title : 제목을 기입하는데 이용합니다
rel : Colorbox 갤러리의 선언된 요소를 그룹화하여 보여주거나 재정의하여 이용할 수 있습니다 
     ex. $("a.gallery").colorbox({rel:"group1"});
     그룹화를 사용하지 않으려면 'nofollow' 로도 설정가능 


이 밖에 옵션에 대한 셋팅 값은 사이트에 접속하여 확인이 가능하겠습니다

해당 플러그인은 활용용도가 넓고 많이 사용하는 플러그인 이므로
사이트 작업시 유용하게 사용되겠습니다