Wie zu stoppen (um umzukehren) eine Fabricjs Animation

Question

Ich möchte einen Maus-Rollover-Effekt erstellen, wie wir in Flash-Websites zu sehen - wenn die Maus über ein Element rollt beginnt es zu animieren, aber wenn in der Mitte Von der Animation der Maus rollt die Animation ab und läuft zurück.

Ich möchte den gleichen Effekt mit Stoff erreichen, aber ich kann scheinen, einen Weg zu finden, die Animation zu stoppen. Zum Beispiel:

rect.animate('top', '200', { 
    duration: 1000, 
    onChange: canvas.renderAll.bind(canvas), 
    onComplete: function() { 
     //callback code goes here 
    } 
    }); 

Dies wird animieren, bis der top Wert der rect200 werden wird. Gibt es eine Möglichkeit, die Animation davor zu stoppen?

Answer 1

Sie müssen die Funktion abort angeben.

rect.animate('top', '200', { 
    duration: 1000, 
    onChange: canvas.renderAll.bind(canvas), 
    onComplete: function() { 
     //callback code goes here 
    }, 
    abort: function(){ 
     return someConditionWhichAbortsAnimationWhenItsTrue; 
    } 
}); 

Das einzige Problem ist, dass abort nicht in die zugrunde liegenden fabric.util.animate, which I just fixed verabschiedet wurde, so dass Sie neueste Version verwenden, benötigen :)