0

これは問題なくモーフィングしますが、最初に一時停止してからモーフィングする必要があります。

var animate = (function(){
    var div = document.getElement('div.es-transition');
    if (div){
        div.set('morph', {duration: 800, transition: 'quad:out'});
        div.pauseFx(1000, 'morph');
        div.addClass('hidden');
        div.setStyles({'visibility': 'hidden', 'opacity': 0});
        div.removeClass('hidden').fade('in');
    }
});

window.addEvent('load', animate);

頭を叩く。

ティア

4

1 に答える 1

1

について知りませんかpauseFx？これは標準の mootools-core API ではありません。http://mootools.net/docs/core/Fx/Fx#Fx:pauseがあり、インスタンスに適用する必要があります。

あなたの場合、実行する前に一時停止するので、とにかく意味がありません。つまり、setTimeoutまたはを使用しますdelay。pauseモーフ/トゥイーンを途中で停止して再開することです。あなたが達成しようとしていることを明確にしてください

また。.set('morph')-fade は ではなく、オプションに.fade()基づいています。トゥイーンとモーフの違いは、単一のプロパティと複数のプロパティです。tweenmorph

私がこれを正しく理解していれば、次のように書き直す必要があります。

var animate = (function(){
    var div = document.getElement('div.es-transition');
    if (div){
        div.set('tween', {duration: 800, transition: 'quad:out'});

        div.addClass('hidden');
        div.setStyles({'visibility': 'hidden', 'opacity': 0});

        (function(){
            div.removeClass('hidden').fade(0, 1);
        }).delay(1000);
    }
});

window.addEvent('load', animate);
于 2012-09-13T19:33:44.017 に答える