비헤이비어(Behavior) 활용

dot2_gre.gif 안내 인사말 삽입

홈페이지를 방문하면 인사말 버튼이 나타나도록 해보자.

페이지의 첫 부분에서 비헤이비어 창을 클릭한다. 버튼을 누르고 onLoad를 선택한다.
오른쪽의 Action창에서 역시 버튼을 누르고 Popup Message를 선택한다.
아래 그림과 같이 Popup Message 창이 뜨게 된다.
Message에 적당한 인사말을 적어넣고 [OK]버튼을 누른다.
 

dot2_gre.gif 마우스가 가면 그림이 바뀌는 후버 버튼 만들기

한 벌짜리 그림을 먼저 준비한다.
① playnext-over.GIF : 보통 상태일 때의 버튼
② playnext-down.GIF : 마우스가 올라가면 바뀔 버튼 
편지창에 보통 상태의 버튼 그림①을 넣는다.
그림의 이름을 다음과 같이 준다. 여기서는 'button1'이라고 주었다. 이 이름은 일종의 변수와 같은 역할을 한다.
 
버튼을 마우스로 선택하고 비헤이비어 창을 연다.
[Event]창에서 버튼을 누르고 (onMouseOver)를 선택한다. 즉 마우스가 그림 위에 있을 때 어떻게 하겠다는 뜻이다.
오른쪽의 [Actions]창에서 버튼을 누르고 [Swap Image]를 선택한다.
 
그러면 다음과 같은 창이 나타나게 된다.

[Named Images:]에는 선택된 이미지 이름이 자동으로 나타난다. 이미지가 여러 개 있으면 이미지 이름을 보고 골라야 한다.
[Set Source to:]에서 [Browse...]버튼을 누르고 마우스가 올라갔을 때 바뀌어 나올 그림을 탐색해 넣는다.
[OK] 버튼을 누른다.
이번에는 마우스가 그림 밖으로 벗어났을 때의 경우를 같은 요령으로 만든다.
[Event]는 [onMouseOut]을 선택하고,  오른쪽의 [Actions]창에서 버튼을 누르고 [Swap Image]를 선택한다.
그림은 편집창에 이미 넣어놓은 그림 파일을 선택해야 할 것이다.
이로써 간단하게 구현되는 후버 버튼을 만들어 보았다. 

이 외에도 드림위버는 타 웹 편집기에서 구현하기 어려운 많은 첨단(?) 기능을 갖추고 있다.
이에 대한 공부는 다음 사이트에서 좋은 정보를 얻을 수 있을 것이다.

b_arrow5.gif 김현의 드림위버 강좌