아래 스크립트는 창이 열리며 좌우에서 커튼이 열리는 듯한 효과를 냅니다. 커튼의 색이나 기타 설정을 바꿀 수도 있습니다.
다음을 <HEAD></HEAD> 사이에 넣습니다.
<style>
<!--
.intro{
position:absolute;
left:0;
top:0;
layer-background-color:black;
background-color:black;
border:0.1px solid balck
}
-->
</style>
다음을 <BODY></BODY> 사이에 넣습니다.
<div id="i1" class="intro"></div>
<div id="i2" class="intro"></div>
<div id="i3" class="intro"></div>
<div id="i4" class="intro"></div>
<div id="i5" class="intro"></div>
<div id="i6" class="intro"></div>
<div id="i7" class="intro"></div>
<div id="i8" class="intro"></div>
<script language="JavaScript1.2">
var speed=100
var temp=new Array()
var temp2=new Array()
if (document.layers){
for (i=1;i<=8;i++){
temp[i]=eval("document.i"+i+".clip")
temp2[i]=eval("document.i"+i)
temp[i].width=window.innerWidth
temp[i].height=window.innerHeight/8
temp2[i].top=(i-1)*temp[i].height
}
}
else if (document.all){
var clipright=document.body.clientWidth,clipleft=0
for (i=1;i<=8;i++){
temp[i]=eval("document.all.i"+i+".style")
temp[i].width=document.body.clientWidth
temp[i].height=document.body.offsetHeight/8
temp[i].top=(i-1)*parseInt(temp[i].height)
}
}
function openit(){
window.scrollTo(0,0)
if (document.layers){
for (i=1;i<=8;i=i+2)
temp[i].right-=speed
for (i=2;i<=8;i=i+2)
temp[i].left+=speed
if (temp[2].left>window.innerWidth) clearInterval(stopit)
}
else if (document.all){
clipright-=speed
for (i=1;i<=8;i=i+2){
temp[i].clip="rect(0 "+clipright+" auto 0)"
}
clipleft+=speed
for (i=2;i<=8;i=i+2){
temp[i].clip="rect(0 auto auto "+clipleft+")"
}
if (clipright<=0) clearInterval(stopit)
}
}
function gogo(){
stopit=setInterval("openit()",100)
}
gogo()
</script>
'Tech: > HTML·DHTML' 카테고리의 다른 글
| 페이지 내용안의 이미지 바꾸기 (0) | 2008.06.26 |
|---|---|
| 튀어나오는 애니메이션 효과 글자 (0) | 2008.06.26 |
| 시간 컨트롤: 방문시각에 맞춘 인삿말 (0) | 2008.06.26 |
| 링크 클릭시 메인페이지 바꾸기 (0) | 2008.06.26 |
| Filter로 다양한 글자모양 만들기(IE) (0) | 2008.06.26 |
