2013-07-09 56 views
6

我正在使用jQuery動畫和CSS3轉換。jQuery緩動vs CSS3轉換 - 是否有精確等價的平滑?

問題是我找不到等效的平滑動畫。有沒有?

我得到的最接近的是(jQuery easeOutQuad和CSS3默認緩動)。

CSS:

#div1 { transition: width 0.5s; } 

的jQuery:

$('#div2').animate({'width': 200}, 500, 'easeOutQuad'); 

http://jsfiddle.net/bzw4q/

但他們仍然是不同的。

我希望兩者在同一時間一起動畫(使用任何良好的緩動算法)。那可能嗎?

+1

您也可以定義[使用CSS3的轉換定時函數](http://www.w3.org/TR/css3-transitions/#transition-timing-function-property);那是你要求的嗎? –

+1

爲什麼不用jQuery添加類名,並使用它來啓動和同步動畫? –

回答

2

swingease-in-out>http://jsfiddle.net/et6Hg/

嘗試我覺得你有更好的機會:)

+1

謝謝你Ussama!好的是'swing'是默認值,不利的一面是你需要將jQuery持續時間乘以0.96。但非常感謝! – Aximili