Este artigo descreve o efeito do JS para alcançar o efeito de comutação de animação das persianas verticais verdes e brancas. Compartilhe para sua referência. A análise específica é a seguinte:
Explicamos um efeito de animação com alternância cega na Web, mas é um cego horizontal. Este é um cego vertical. O código é basicamente o mesmo:
Copie o código da seguinte forma: <html>
<head>
<title> Efeito de comutação de página cega </title>
<estilo>
<!-
.Intro {
Posição: Absoluto;
Esquerda: 0;
topo: 0;
cor-de-background: verde;
Background-Color: verde;
Borda: 0,1px verde sólido
}
->
</style>
</head>
<Body>
<div id = "i1"> </div> <div id = "i2"> </div> <div id = "i3"
class = "Intro"> </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 Speed = 20
var temp = novo array ()
var temp2 = novo array ()
if (document.layers) {
para (i = 1; i <= 8; i ++) {
Temp [i] = Eval ("document.i"+i+". clip")
temp2 [i] = avaliar ("document.i"+i)
Temp [i] .Width = Window.innerWidth/8-0.3
temp [i] .Height = window.innerHeight
temp2 [i] .left = (i-1)*temp [i] .Width
}
}
else if (document.all) {
var clipbottom = document.body.offsetHeight, cliptop = 0
para (i = 1; i <= 8; i ++) {
temp [i] = EVALL ("document.all.i"+i+". style")
temp [i] .Width = document.body.clientWidth/8
temp [i] .Height = document.body.offsetHeight
temp [i] .left = (i-1)*parseint (temp [i] .Width)
}
}
function Openit () {
Window.Scrollto (0,0)
if (document.layers) {
para (i = 1; i <= 8; i = i+2)
temp [i] .bottom- = velocidade
para (i = 2; i <= 8; i = i+2)
temp [i] .top+= velocidade
if (temp [2] .top> window.innerHeight)
ClearInterval (Stopit)
}
else if (document.all) {
clipbottom- = velocidade
para (i = 1; i <= 8; i = i+2) {
temp [i] .clip = "ret (0 auto+"+clipbottom+"0)"
}
cliptop+= velocidade
para (i = 2; i <= 8; i = i+2) {
temp [i] .clip = "rect ("+cliptop+"automático automático)"
}
if (clipbottom <= 0)
ClearInterval (Stopit)
}
}
função Gogo () {
Stopit = setInterval ("Openit ()", 100)
}
Gogo ()
</script>
</body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.