이 기사에서는 JS의 수평 블라인드 효과 웹 페이지의 애니메이션 효과를 전환하는 방법에 대해 설명합니다. 참조를 위해 공유하십시오. 특정 분석은 다음과 같습니다.
이것은 매우 간단하지만 좋은 웹 페이지 전환 효과입니다. 새 웹 페이지를 클릭하면 웹 페이지가 모든 웹 페이지가 완전히 표시 될 때까지 파란색과 흰색 블라인드간에 자동으로 전환됩니다. 코드는 다음과 같습니다.
다음과 같이 코드를 복사하십시오. <html>
<헤드>
<title> JS 웹 블라인드 동적 스위칭 효과 </title>
<스타일>
<!-
.intro {
위치 : 절대;
왼쪽 : 0;
상단 : 0;
레이어 백 지하색 : 파란색;
배경색 : 파란색;
테두리 : 0.1px 솔리드 블루
}
->
</스타일>
</head>
<body>
<div id = "i1"> </div> <div id = "i2"> </div> <div id = "i3"
클래스 = "소개"> </div> <div id = "i4"> </div> <div id = "i5"> </div> <div> <div
id = "i6"> </div> <div id = "i7"> </div> <div id = "i8"> </div>
<script language = "javaScript1.2">
var 속도 = 20
var temp = 새로운 배열 ()
var temp2 = 새로운 배열 ()
if (document.layers) {
for (i = 1; i <= 8; i ++) {
온도 [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 clipright = document.body.clientWidth, clift = 0
for (i = 1; i <= 8; i ++) {
온도 [i] = eval ( "document.all.i"+i+". Style")
온도 [i] .width = document.body.clientWidth
온도 [i] .height = document.body.offsetheight/8
온도 [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)
온도 [i] .right- = 속도
for (i = 2; i <= 8; i = i+2)
온도 [i] .left+= 속도
if (temp [2] .left> window.innerwidth)
ClearInterval (stopit)
}
else if (document.all) {
Clipright- = 속도
for (i = 1; i <= 8; i = i+2) {
온도 [i] .clip = "rect (0"+clipright+"auto 0)"
}
Clipleft+= 속도
for (i = 2; i <= 8; i = i+2) {
온도 [i] .clip = "rect (0 Auto Auto"+Clipleft+")" "
}
if (clipright <= 0)
ClearInterval (stopit)
}
}
기능 gogo () {
stopit = setInterval ( "openit ()", 100)
}
고고 ()
</스크립트>
</body>
</html>
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.