Dreamweaver(이하 DW)는 페이지에서 대화형 동작을 구축하는 데 도움이 되는 "비헤이비어"라는 메커니즘을 제공합니다. 행동은 사용자가 페이지와 상호 작용하는 웹 페이지에서 수행되는 일련의 작업입니다. DW의 동작을 사용하면 단 한 줄의 코드도 작성하지 않고도 풍부한 동적 페이지 효과를 얻고 사용자 페이지 상호 작용을 달성할 수 있습니다.
행동은 이벤트(event)와 액션(action)으로 구성됩니다. 이벤트는 트리거된 작업의 결과이며, 작업은 브라우저 창 열기, 사운드 재생 등과 같은 특정 작업을 완료하는 데 사용되는 미리 작성된 JavaScript 코드입니다.
페이지 요소에서 동작을 사용할 때 트리거될 작업과 이벤트를 지정합니다. DW는 페이지 요소에 적용할 수 있는 몇 가지 특정 작업을 제공했습니다.
1. 일부 기본 내장 동작
1. Call JavaScript(Call JavaScript)
이 동작을 사용하면 특정 이벤트가 트리거될 때 해당 JavaScript 스크립트가 호출되어 해당 작업을 구현하도록 설정할 수 있습니다. 이 동작을 설정할 때 JavaScript 스크립트나 함수를 직접 입력할 수 있습니다.
2. 속성 변경(Change Property)
이 동작을 사용하면 이미지 크기, 레이어 배경색 등과 같은 개체 속성을 동적으로 변경할 수 있습니다. 이 동작 설정은 브라우저 지원에 따라 다릅니다.
3. 브라우저 확인
다양한 브라우저의 지원 기능에는 일정한 차이가 있습니다. 이 동작을 사용하면 브라우저 버전을 확인하여 다른 페이지로 이동할 수 있습니다.
4. 플러그인 확인
Flash를 사용하여 만든 웹페이지와 같이 우리가 만드는 페이지에는 특정 플러그인의 지원이 필요한 경우가 있으므로 사용자 브라우저의 플러그인을 확인하여 지정된 플러그인이 있는지 확인해야 합니다. 설치되었습니다. 이 동작이 바로 그 역할을 합니다.
5. Control Shockwave 또는 Flash (Control Shockwave 또는 Flash)
Shockwave 및 Flash는 현재 웹 페이지 제작에 자주 삽입되는 개체입니다. 이 동작은 이러한 개체를 제어하는 데 사용됩니다. 이를 사용하여 애니메이션의 재생, 중지, 복귀를 제어할 수 있으며, 직접 이동할 프레임을 제어할 수도 있습니다.
6. 레이어 이동(레이어 드래그)
"레이어 이동" 동작을 통해 페이지의 레이어 이동은 물론 레이어가 있는 콘텐츠의 이동도 실현할 수 있습니다.
7. URL로 이동(Go To URL)
현재 브라우저 창이나 지정된 프레임 창을 지정하여 지정된 페이지를 로드할 수 있습니다.
8. 점프 메뉴
"점프 메뉴" 동작은 주로 점프 양식을 편집하는 데 사용됩니다.
9. 팝업 메시지 대화 상자(Popup Message)
페이지에 정보 대화 상자를 표시하거나 사용자에게 프롬프트 메시지를 표시하려는 경우 이 동작을 사용할 수 있습니다.
2. 간단한 예
아래에서는 동작의 사용을 소개하기 위해 동적 사진을 예로 들어 보겠습니다. 먼저 같은 크기의 두 장의 그림 1과 2를 만들어야 합니다. 구체적인 단계는 다음과 같습니다.
1. DW를 열어 페이지를 생성하고 이 페이지에 그림 1을 삽입합니다.
2. DW 편집 창에서 그림 1을 선택합니다.
3. "창" 메뉴에서 "동작"을 선택하거나 F8 키를 눌러 동작 패널을 엽니다. 이벤트 팝업 메뉴에서 "3.0 이상 브라우저"를 선택해야 합니다.
4. "+" 버튼을 눌러 새로운 동작인 "이미지 교체"를 추가하면 "이미지 교체" 대화 상자가 나타납니다. 사진 목록에서 페이지의 모든 사진 목록을 볼 수 있습니다. 변환하려는 사진 1을 선택합니다. 마우스 포인터를 해당 사진 위로 이동하면 강조 표시된 사진 2로 대체됩니다. 대리자.
5. 찾아보기 버튼을 클릭하고 교체하려는 사진을 선택합니다. "onMouseOver" 이벤트를 통해 선택한 사진 2가 원본 사진 1을 대체합니다.
6. 이미지 사전 호출 및 저장에 대한 기본 설정을 선택합니다.
"이미지 미리 로드" 옵션은 전체 페이지가 다운로드될 때 변환된 이미지가 브라우저의 캐시에 저장됨을 의미합니다. 시청자가 처음으로 마우스 포인터를 Our Story 이미지 위로 이동할 때 강조 표시된 이미지를 거의 느낄 수 없습니다. 의 등장에는 지연이 없습니다. "Restore Images onMouseOut" 옵션은 "onMouseOut"(마우스 아웃) 이벤트가 발생하면 이미지가 자동으로 원래 상태로 복원된다는 의미입니다.
7. 설정이 완료되면 "확인" 버튼을 클릭하여 "이미지 교환" 대화 상자를 닫고 이전 설정을 적용합니다.
이때 동작 패널에는 방금 그림에 대해 설정한 이벤트와 작업이 포함되어 있습니다. "OnMouseOver" 이벤트 옆에는 "이미지 교체" 작업 표시가 있고 그 위에는 "onMouseOut" 이벤트와 해당 "이미지 교체 복원" 작업이 있습니다(이 동작은 이미지 교체 대화 상자에서 기본값을 수락할 때 나타납니다). 상자 옵션이 정의됨).
8. 동작 패널을 닫습니다. 페이지를 미리 보려면 F12 키를 누르세요. 마우스 포인터를 그림 1로 이동하면 그림 2로 바뀌는 것을 확인할 수 있습니다.
위의 예는 DW Behavior의 간단한 적용 예입니다. 이 외에도 다양한 용도가 있으므로 여기서는 하나씩 설명하지 않겠습니다. 또한 DW를 사용하면 Macromedia 홈페이지에서 다운로드할 수 있는 확장된 동작을 사용할 수도 있습니다.