Velocity.js清除動畫後的默認值

我有一個頁面上的元素想要動畫來查看，但是在他們動畫之後，我想將它們的動畫推遲到CSS（通過更改類）。 ..我發現速度離開了我所有的動畫屬性在style=標籤，並使CSS轉換不可能。Velocity.js清除動畫後的默認值

我低於解決方案，但重置CSS上完整似乎玄乎，我想知道是否有更好的方法來做到這一點？

// first use CSS to hide the element and squish it 
$el.css({ 
    width: 0, 
    left: "-10px", 
    opacity: 0, 
    marginRight: 0, 
    transition: "none" 
}) 

// now animate the width and margin (do this first 
// so there's a little gap between existing elements 
// before we fade in new element. 
.velocity({ 
    width: width, 
    marginRight: margin 
}, { 
    queue: false, 
    duration: 230 
}) 

// then fade and move in the new element, 
// but this is the iffy bit when it completes 
// I have to unset all the styles I've animated? 
.velocity({ 
    left: 0, 
    opacity: 1 
}, { 
    queue: false, 
    duration: 100, 
    delay: 130, 
    complete: function(els) { 

     $(els).css({ 
      width: "", 
      left: "", 
      opacity: "", 
      marginRight: "", 
      transition: "" 
     });    
    } 
});

來源

2014-10-02 simey.me

通常情況下，你想動畫引擎，直列離開風格;否則最終值將彈出，因爲它們在刪除時被樣式表覆蓋。

您也可以使用$(els).attr("style", "");來清除所有樣式。

來源

2014-10-02 18:33:47 execution

謝謝，@執行，清除它！ :) - 我想我會根據你的回答重新考慮它:) – 2014-10-03 01:46:54

也許，一個更清潔的方法會使用$（els）.removeAttr（「風格」）。要考慮的方面有時候你是動畫CSS元素，JQuery的.css（）方法無法達到。然後，請參閱Velocity的'hook'方法。 – 2015-03-20 22:47:51

Velocity.js清除動畫後的默認值

回答

相關問題