设置mootools链的延迟

时间:2012-02-11 08:32:31

标签: mootools delay chain

我一直在尝试设置一个mootools链,然后在网站中应用它。所以,我已经完成了,但是,仍然......我需要在序列开始时设置延迟,我的意思是,在一切开始之前等待5秒,我试图设置.delay(5000)但是只是没有成功,pleeaaase帮助。谢谢,这是完整的代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <title>Probando chain de mootools</title>
    <script src="mootools.js" type="text/javascript"></script>

<script>


var ClaseChainEfecto = new Class({
    //implemento chain
    Implements: Chain,

    initialize: function(){
        this.efecto1 = new Fx.Tween('elem1', {
            property: 'opacity',
            duration: 1000,
            onComplete: function(){
                this.callChain();
            }.bind(this)
        });
        this.efecto2 = new Fx.Tween('elem2', {
            property: 'opacity',
            duration: 1000
        });
    },

    efectos: function(){
        this.chain(
            function(){ this.efecto1.start(1,0); },
            function(){ this.efecto2.start(0,1); }
        );
        this.callChain();
    }
});

window.addEvent("domready", function(){
    miClaseChainEfecto = new ClaseChainEfecto();
    miClaseChainEfecto.efectos();
});
</script>
<style type="text/css">
.miestilo1{
    float: left;
    width: 80px;
    background-color: 333399;
    color: #fff;
    padding: 15px;
    font-size: 14pt;
    margin: 15px;
    float:left;
    position:absolute;
}
.miestilo2{
    float: left;
    width: 80px;
    background-color: 333399;
    color: #fff;
    padding: 15px;
    font-size: 14pt;
    margin: 15px;
    visibility:hidden;
    opacity:0;
    float:left;
    position:absolute;
}
</style>
</head>

<body>
<div id="elem1" class="miestilo1">
HOLA!! estoy probando chain. Pongo esta capa con más texto para que se vea!!
</div>
<div id="elem2" class="miestilo2">
Esto es un segundo elemento. Que también tendrá su efecto!
</div>

</body>
</html>

0 个答案:

没有答案