수평 블라인드 효과 웹 페이지 전환 애니메이션 effect_javascript 기술을 달성하는 js 방법

이 기사의 예에서는 js를 사용하여 수평 블라인드 효과 웹 페이지 전환 애니메이션 효과를 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

매우 간단하지만 효과적인 웹페이지 전환 효과입니다. 새 웹페이지를 클릭하면 전체 웹페이지가 표시될 때까지 파란색과 흰색 셔터 선으로 웹페이지가 자동으로 전환됩니다. 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

스타일>
머리>

class="intro">

div>

id="i6" class="intro">

var 속도=20
var temp=new 배열()
var temp2=새 배열()
if (document.layers){
(i=1;i temp[i]=eval("document.i" i ".clip")
temp2[i]=eval("document.i" i)
임시[i].width=window.innerWidth
온도[i].height=window.innerHeight/8
temp2[i].top=(i-1)*temp[i].height
}
}
else if (document.all){
var clipsright=document.body.clientWidth,clipleft=0
(i=1;i temp[i]=eval("document.all.i" i ".style")
임시[i].width=document.body.clientWidth
임시[i].height=document.body.offsetHeight/8
temp[i].top=(i-1)*parseInt(temp[i].height)
}
}
함수 openit(){
window.scrollTo(0,0)
if (document.layers){
(i=1;i 온도[i].right-=속도
(i=2;i 온도[i].왼쪽 =속도
if (temp[2].left>window.innerWidth)
클리어 인터벌(중지)
}
else if (document.all){
클립라이트-=속도
(i=1;i temp[i].clip="Rect(0 "clipright " 자동 0)"
}
클립왼쪽 =속도
(i=2;i temp[i].clip="Rect(0 자동 자동 "clipleft ")"
}
if (clipright 클리어 인터벌(중지)
}
}
함수 gogo(){
stopit=setInterval("openit()",100)
}
고고()

본문>

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.