본문 바로가기
공부/웹디자인

드림위버 ) AP Div를 이용해서 팝업 창 효과 적용하기

by Ohming 2011. 12. 29.
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
출처 : 실력이 탐나는 드림위버 CS5

AP Div를 이용해서 홈페이지를 만들어 본적이 없었고, 팝업창을 띄울때도 다른 웹문서를 만들어서 띄우곤 했었다.
그런데 이렇게 깔끔하게 팝업창을 만드는 방법이 있을줄이야.......
내가 오랫동안 공부를 안해왔구나 느꼈다.

AP Div 안에 이미지를 넣었는데 이 이미지의 'X'를 누르면 이 AP Div가 사라지도록 (팝업창처럼) 만들었는데

먼저 'X'를 누를 부분에 이미지맵 사각형을 그렸다.

그리고 그 사각형 이미지맵에 비헤이비어를 추가하기 위해 '+'를 누르고 '요소 표시-숨김'을 선택했다.

요소 중에서 div "pop"을 클릭하고 아래의 '숨김'버튼을 눌렀다.

그렇게 하면 요소 표시-숨김이 생기는데 이벤트를 'onClick'으로 지정해준다.


결과화면: 이제 이곳의 'X'를 누르면

팝업창이 없어지게된다.


댓글