El siguiente es el código del programa:
Copiar código del código de la siguiente manera:
<!
<html>
<Evista>
<meta http-equiv = "content-type" content = "text /html; charset = gb2312" /> />
<meta http-oquiv = "x-ua-compatible" content = "ie = emulatie7" />
<title> Imagen Flip Effect </title>
<Style type = "text/css">
.Box {desbordamiento: oculto;
.txt {ancho: 100%;
Text-Align: Center;
#B1 {fondo: url (http://biyuan.tk/u/upload/201310221457326875.jpg);
#B2 {fondo: url (http://biyuan.tk/u/upload/201310221457486875.jpg);
#B3 {fondo: url (http://biyuan.tk/u/upload/201310221458149843.jpg);
</style>
</ablo>
<Body>
<div id = "obj">
<div id = "b1"> <div> descripción del texto <br/> descripción del texto </r/> text </div> </div>
<div id = "b2"> <div> Descripción del texto <br/> Descripción del texto </r/> Texto </div> </div>
<div id = "b3"> <div> descripción del texto <br/> descripción del texto </r/> text </div> </div>
</div>
<script type = "text/javaScript">
Función show (o, s, v) {{
ClearInterval (show.prototype ["A" + V]);
Show.prototype ["a" + v] = setInterval (function () {
if (s == -1) {
if (O.OffSettop <= -o.ParentNode.OffSetheight) {{
o.style.top = -o.parentnode.offsetheight + "px";
Return ClearInterval (show.prototype ["A" + V]);
}
} Demás {
if (O.OffSettop> = -10) {
o.style.top = 0;
Return ClearInterval (show.prototype ["A" + V]);
}
}
o.style.top = (O.Offsettop * 1 + 10 * s) + "Px";
}, 10);
}
var igs = document.getElementById ('obj').
para (var i = 0; i <igs.length; i ++) {
if (igs [i] .classname == "box") {{
(Función (x) {
igs [x] .onmouseover = function () {
Show (this.childnodes [0], 1, x);
this.onmouseOut = function () {
Show (this.childnodes [0], -1, x);
}
}
}) (i);
}
}
</script>
</body>
</html>
Vista previa del efecto: http://biyuan.tk/u/upload/201310221500310000.html