[이미지 오버형(롤오버형) 보기폼 만드는 방법]

 



 

 

 

 

 

<작업방법> 

 

1. 작업할 게시판의 게시글을 아무거나 클릭하여 보기페이지로 들어간 뒤 페이지편집 클릭

 

 


 

2. D, I, F 버튼 중 I 클릭 > 임포트변경 클릭

 

 

 

 

3. 다시 F버튼 클릭하여 보기폼 편집화면으로 이동

 

 

 

4. 게시물내용 항목이 들어있는 D 클릭 > DIV넣기 클릭 > 안쪽에 체크 > class="AB-cr" 입력 후 확인

 

 


 

5. 방금 만든 DIV의 D클릭하여 DIV를 안쪽에 두 개 생성

1) 4번에서 만든 DIV의 D 클릭 > DIV넣기 클릭 > 안쪽에 체크 후 확인

2) 다시 한 번 4번에서 만들었던 D 클릭 > DIV넣기 클릭 > 안쪽에 체크 후 확인

 

 


 

 

6. 확대용 이미지 생성

1) 4번 DIV 안에 들어있는 두 개의 DIV 중 첫번 째 D 클릭 > 게시판/회원/로그인 > 게시판도구 > 항목 클릭

 

2) 첨부파일01에 체크 > 출력속성 정의 중 파일에 체크 > 원하는 가로x세로 사이즈 입력 > 

기타속성 입력란에 id="BIG_IMG" 입력 후 확인

 

 


 

 

7. 이미지 오버(롤오버)용 작은 이미지들 생성 

* 아래 과정을 반복하여 여러개 만들어야 합니다. 주의하실 점은 2)번 과정에서 숫자가 변경된다는 점입니다. 

(붉은색으로 표시된 숫자 주의!!)

 

 

<첫번 째 작은이미지>

1) 4번 DIV 안에 들어있는 두 개의 DIV 중 두번 째 D 클릭 > 게시판/회원/로그인 > 게시판도구 > 항목 클릭

 

2) 첨부파일01에 체크 > 출력속성 정의 중 파일에 체크 > 원하는 가로x세로 사이즈 입력 > 

링크설정에서 첫번 째 선택상자는 기본링크 선택 > 우측 입력란에 1 입력 >

두번 째 선택상자에서 롤오버 선택 > 우측 입력란에 BIG_IMG입력 후 확인

 

 


 

<두번 째 작은이미지> -첫번 째 작은이미지를 만든 원리와 동일

1) 4번 DIV 안에 들어있는 두 개의 DIV 중 두번 째 D 클릭 > 게시판/회원/로그인 > 게시판도구 > 항목 클릭

 

2) 첨부파일02에 체크 > 출력속성 정의 중 파일에 체크 > 원하는 가로x세로 사이즈 입력 > 

링크설정에서 첫번 째 선택상자는 기본링크 선택 > 우측 입력란에 2 입력 >

두번 째 선택상자에서 롤오버 선택 > 우측 입력란에 BIG_IMG입력 후 확인

 

 

<세번 째 작은이미지> -위와 원리 동일

1) 4번 DIV 안에 들어있는 두 개의 DIV 중 두번 째 D 클릭 > 게시판/회원/로그인 > 게시판도구 > 항목 클릭

 

2) 첨부파일03에 체크 > 출력속성 정의 중 파일에 체크 > 원하는 가로x세로 사이즈 입력 > 

링크설정에서 첫번 째 선택상자는 기본링크 선택 > 우측 입력란에 3 입력 >

두번 째 선택상자에서 롤오버 선택 > 우측 입력란에 BIG_IMG입력 후 확인


 

 

여기까지 각각 첨부파일01부터 첨부파일03까지 작은이미지들을 불러오도록 작업이 완료되었으면

쓰기폼에서 첨부파일01부터 첨부파일03까지 입력항목을 추가하여 이미지를 첨부하신 뒤 실제화면을 확인하시면 됩니다.

 

 

쓰기폼에 첨부파일 입력항목을 추가하는 방법은 아래 메뉴얼을 확인해주세요.

 http://bos.kr/kwa-manual_v-1523