안녕하세요.. 퍼플F 라고 합니다.

이 게시물은.. 팁이라기 보다는 제 홈피에 적용되어 있는 라이트 박스(facebox) 를 보고 적용법을 물어보시는

분들이 계셔서 짧게 나마 팁란에 적도록 하겠습니다.

그림1) 적용된 페이지 (로그인 부분)

그림2) 적용된 페이지 (최근 이미지 클릭 시 나오는 부분)

적용법

1. 다운로드

-> http://famspam.com/facebox 이 페이지에 접속 후 jQuery 와 Facebox 1.2 를 다운로드 받습니다.

----------------------------------

해당 페이지에 써져 있듯이 Images, Divs, Ajaxes 형태로 적용가능하며 편하신 방법을 하용하시면 됩니다.

(저는 편의상 Divs 를 많이 사용하게 되더군요)

----------------------------------

2. 설치

->

2-1> ftp 프로그램으로(파일질라 추천) 에 다운로드 받은 facebox 폴더와 jquery 를 업로드합니다.

2-2> (편하신 방법을 사용하면 되지만) 저의 경우 해당 레이아웃 스킨에 '해더 스크립트' 부분에

아래와 같은 스크립트를 삽입하였습니다.

-----------------------------------

<link href="http://도메인/facebox/facebox.css" media="screen" rel="stylesheet" type="text/css" />

<script src="http://도메인/js/jquery-1.2.4a.js" type="text/javascript"></script>
<script src="http://도메인/facebox/facebox.js" type="text/javascript"></script>

  <script type="text/javascript">
  jQuery(document).ready(function($) {
  $('a[rel*=facebox]').facebox() 
  })
  </script>

------------------------------------

3. 페이지에 적용

   divs 사용시

 <div id="info" style="display:none;"> 
내용
</div>

     링크걸기

<a href="#info" rel="facebox">텍스트</a>

이렇게 하시면 됩니다.