Ich möchte einen Übergang stoppen, der gerade ausgeführt wird.So stoppen Sie den CSS3-Übergang
Ich habe ein paar Referenzen [1] [2] gefunden, die im Internet verstreut sind, aber ich kann es nicht zusammenfügen.
Hier ist eine Geige des ersten Vorschlag (mit jQuery und CSS Transit für Kontext): http://jsfiddle.net/thomseddon/gLjuH/
Dank
[1] https://twitter.com/evilhackerdude/status/20466821462
[2] github.com/madrobby/zepto/ Themen/508
Also habe ich es aus: http://jsfiddle.net/thomseddon/gLjuH/3/
Der Trick eac gesetzt ist h CSS-Eigenschaft, die Sie auf ihren aktuellen Wert animieren (möglicherweise mittleren Übergang) wie: $(this).css('prop', $(this).css('prop')); (Wahrscheinlich würde alle Eigenschaften in einem Objekt im Element mit $ (this) .data (Requisiten) speichern möchten; und durchschlinge sie).
Sobald Sie die Eigenschaften explizit festgelegt haben, können Sie eine 0s-Animation ausführen, um die vorherige Animation zu überschreiben und das Element effektiv anzuhalten.
Danke für die jsfiddle. Ich habe etwas Refactoring gemacht und es auf das Kernkonzept hier heruntergebrochen: http://jsfiddle.net/jedhunsaker/gLjuH/13/ – jedmao
@mrjedmao - der Fidel Link ist tot :( – Danield
@Danield Sorry, ich habe meinen Namen kürzlich geändert Es ist jetzt http://jsfiddle.net/jedmao/gLjuH/13/ – jedmao
Es gibt eine viel einfachere Lösung. Wenn Sie den Übergang einfach anhalten möchten (und ihn nicht anhalten). Stellen Sie die CSS auf den aktuellen berechneten Stil ein. Zum Beispiel in einer benutzerdefinierten Scroll-Lösung, wobei top die Eigenschaft transitioned ist.
element.style.top=getComputedStyle(element).top;
und das ist es.
Check dies vielleicht aus http://stackoverflow.com/questions/5312289/interrupting-stop-a-css3-transition-on-the-actual-position-state – Afshin
Dank helfen, sollten auch sie –
Got verknüpft haben es: http://jsfiddle.net/thomseddon/gLjuH/3/ –