시작페이지로 즐겨찾기추가
로그인
회원가입 l 출석체크 l 마이페이지 l CGIMALL
happycgi
자료실 사이트등록 랭킹100 프로그램리뷰 관리자추천자료 초보가이드
커뮤니티
전체 펼쳐보기
퀵메뉴링크 jquery , CSS , PHP , Javascript , 무료폰트 , ASP
상세검색
 > JAVASCRIPT > javascript 소스창고 > JQuery > jquery Colorbox Ver1.6.4 상세정보
사이트등록
현재접속자 새로고침
jquery Colorbox Ver1.6.4
소스통계정보 오류신고 및 문의
해피팀
네티즌
트위터로 보내기 페이스북으로 보내기 싸이월드 공감
소스분류 JQuery
다운로드 횟수 3 회
간단설명 jquery 라이트 박스 플러그인
평가하기 훌륭함 매우좋음 좋음 괜찮음 보통 별로
홈페이지바로가기 소스다운로드 데모 미리보기가 없습니다 스크랩하기

* 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' 로도 설정가능 


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

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


네티즌 의견   이용하신 자료의 후기를 자유롭게 작성하세요. (상업적인 광고 및 도배성 글 등은 사전통보없이 삭제될 수 있습니다.)
내용 아이디 의견남기기
등록된 의견이 없습니다.
1
이름
내용
:네맞아요: :화나는군요: :잠와: :우울해: :이건아냐: :왕하하: 왕웃음~ 놀램~
도배방지키
 38647395 보이는 도배방지키를 입력하세요.