アニメーションオプションが含まれているとjqueryコールバックが機能しません（masonryプラグイン）

Question

ビルドしようとしているサイトのDavid DeSandroのJQuery Masonryプラグインを実装しています。私はそれが実行された後、私はアニメーションがオンになっているときに何らかの理由でそれを動作させることができませんページの関連部分にスクロールできるように、石工関数のコールバックを実行しようとしています。ドキュメントはhttp://desandro.com/demo/masonry/docs/#optionsにあります。私は、次のコードを実行すると、それが正常に動作し、アラートが唯一の石工の機能が実行された後に起こります。私は、アニメーションのオプションを使用して、次のコードを実行すると

$wall.masonry(
{ 
columnWidth: 216, 
itemSelector: '.box:not(.invis)', 
animate: false 
}, 
function() 
{ 
alert("Finished?"); 
} 
); 

。ただし、アラートの実行を含むアニメーションが完了する前に：

$wall.masonry(
{ 
columnWidth: 216, 
itemSelector: '.box:not(.invis)', 
animate: true, 
animationOptions: { 
    duration: speed, 
    queue: false 
} 
}, 
function() 
{ 
alert("Finished?"); 
} 
); 

私が困惑しているのでアニメーションが完了するまで、アラートの発生を防ぐ方法については、誰でも私に教えていただけます。あなたの助けをありがとう、

デイブ

Answer 1

があり、あなたが行うことができるものだが、それを自分の感覚で働くためには、小さなハックが必要です。

が渡されたanimationOptionsにオブジェクトがcompleteプロパティを取ることができますが、これアニメーションが完了した後に起動される関数を定義します。

問題はです。すべてのブロックが個別にアニメーション化されているため、これはブロックごとに適用されます。しかし、あなたはこれを回避することができます：

var boxCount = $wall.find('box').size(), 
    counter = 0, 
    onComplete = function() { 
     if (counter < boxCount) counter++; 
     else { 
      alert("Finished?"); // <-- Here goes your actual callback! 
      counter = 0; 
     } 
    } 

$wall.masonry({ 
    columnWidth: 216, 
    itemSelector: '.box:not(.invis)', 
    animate: true, 
    animationOptions: { 
     duration: speed, 
     queue: false, 
     complete: onComplete 
    } 
});