사실 얼마전까지 필자의 홈페이지를 방문한 후 임의의 링크를 클릭하면 현재 페이지가 서서히 사라지면서 링크가 열리는 것을 경험했을 것이다. 바로 이해가 되지않는다면 필자의 블로그,
도아의 세상 사는 이야기 
를 방문해 보기바란다.
사실 이처럼
페이지를 인/아웃 시키는 것은 아주 간단하다. JavaScript로도 구현이 가능하지만 보다 간단한 방법은
MSIE에서 지원하는 확장 태그를 사용하면된다. 절차는 다음과 같다.
- 페이드 인/아웃 시켜려는 페이지를 연다.
- <HEAD>와 </HEAD> 태그 사이에 다음과 같은 코드를 삽입한다.
<META HTTP-EQUIV=PAGE-ENTER CONTENT=TRANSITION>
<META HTTP-EQUIV=PAGE-EXIT CONTENT=TRANSITION>
예:
<META http-equiv=page-enter content=revealTrans(Duration=0.5,Transition=23)>
<META http-equiv=page-exit content=revealTrans(Duration=0.5,Transition=23)>
여기서 사용할 수 있는 TRANSITION은 다음과 같다.
| 값 |
효과 |
| blendTrans(Duration=n) |
| Duration=n |
브렌드 효과 |
| revealTrans(Duration=n,Transition=n) |
| Transition=0 |
사각형으로 페이드 인 됨 |
| Transition=1 |
사각형으로 페이드 아웃 됨 |
| Transition=2 |
원형으로 페이드 인 됨 |
| Transition=3 |
원형으로 페이드 아웃 됨 |
| Transition=4 |
기존 화면을 아래서 위로 지우면서 화면 전환 |
| Transition=5 |
기존 화면을 위에서 아래로 지우면서 화면 전환 |
| Transition=6 |
기존 화면을 왼쪽에서 오른쪽으로 지우면서 화면 전환 |
| Transition=7 |
기존 화면을 오른쪽에서 왼쪽으로 지우면서 화면 전환 |
| Transition=8 |
수평 브라인드가 열리는 것처럼 화면 전환 |
| Transition=9 |
수직 브라인드가 열리는 것처럼 화면 전환 |
| Transition=10 |
체커판이 서로 교차되어 나타나면서 화면 전환 |
| Transition=11 |
체커판이 아래로 열리면서 화면 전환 |
| Transition=12 |
두화면이 겹치면서 화면 전환됨 |
| Transition=13 |
문이 닫히는 것저럼 화면을 수직으로 나누어 페이드인 됨 |
| Transition=14 |
문이 열리는 것처럼 화면을 수직으로 나누어 페이드 아웃 됨 |
| Transition=15 |
화면을 수평으로 나누어 페이드인 됨 |
| Transition=16 |
화면을 수평으로 나누어 페이드 아웃 됨 |
| Transition=17 |
우측 상단에서 아래 방향으로 스티커를 띠는 것처럼 화면 전환 |
| Transition=18 |
후측 하단에서 윗 방향으로 스티커를 띠는 것처럼 화면 전환 |
| Transition=19 |
좌측 상단에서 아래 방향으로 스티커를 띠는 것처럼 화면 전환 |
| Transition=20 |
좌측 하단에서 윗 방향으로 스티커를 띠는 것처럼 화면 전환 |
| Transition=21 |
수평의 직선을 이용해서 화면 전환 |
| Transition=22 |
수직의 직선을 이용해서 화면 전환 |
| Transition=23 |
1에서 22까지의 효과가 랜덤하게 적용됨 |
댓글: 이 팁은 ynetwork님의 질문, 어엇..!에대한 답으로 작성되었습니다.
(