각 반복 사이의 지연

Question

Mootools에서 div의 그룹을 한 번에 하나씩 페이드 상태로 유지하려고합니다. 기본적으로 각 각 반복 사이에 지연을 추가하려면 :

$$('.someclass').each(function(el){ 
     el.set('tween', { 
     duration: 1000 
     }); 
     el.tween('opacity',0,1); 
    }); 

Answer 1

아니면 그냥 할 수있는 ....

document.getElements('.someclass').each(function(el, index) { 
    el.set('tween', { 
     duration: 1000 
    }).fade.delay(index * 1000, el, [0, 1]); 
}); 

이 첫 번째 후 각 연속 페이드 일초를 시작합니다.

은 1.3.2에서 테스트 작업 : http://jsfiddle.net/dimitar/jMdbR/

1.4.1 깨진 것 같다 : http://jsfiddle.net/dimitar/jMdbR/1/ 인해 method overloading to the Fx.Tween instance being removed에 - 당신은 당신이 시작하기 전에 불투명도를 설정하여 해결할 수 있지만 - 또는 .tween를 사용하여 :

document.getElements('.someclass').each(function(el, index) { 
    el.set('tween', { 
     duration: 1000 
    }).tween.delay(index * 1000, el, ["opacity", [0, 1]]); 
}); 

http://jsfiddle.net/dimitar/jMdbR/4/ 트위터와 함께 작동하는 1.4.1 버전의 경우.

Answer 2

기능 반복 루프를 사용하여이 작업을 수행 할 수 있습니다. Mootools의 주어

var divs = $$(".someclass"); // Assuming this object is Array-like 

var iterator = function (elements, i) { 
    if (!elements.hasOwnProperty(i)) return; 

    var element = elements[i++]; 
    element.set("tween", {duration: 1000}); 
    element.tween("opacity", 0, 1); 

    // Note: not sure if this is the actual API to get notified when 
    // the animation completes. But this illustrates my point. 
    element.set("events", {complete: function() { 
     iterator(elements, i); 
    }}); 
} 

iterator(divs, 0); 

는 API 애니메이션이 완료되면, 업데이트 된 i 카운터 재귀 iterator 함수를 호출하는 것을 사용할 수있는 알림을받을를 제공합니다.