我無法弄清楚如何在jQuery中執行緩動操作

這是我從互聯網上拼湊出來的東西。 slideDown的作品，但它仍然看起來線性。我的問題是完全錯誤的還是我錯過了一些微妙的東西？我如何得到它的工作？我無法弄清楚如何在jQuery中執行緩動操作

$.easing.easeOutQuad = function (x, t, b, c, d) { 
    return -c *(t/=d)*(t-2) + b; 
}; 

$("#view").slideDown(200,'easeOutQuad');

來源

2012-06-15 rtoner

你是問關於自定義寬鬆？因爲jQuery UI帶有許多緩動功能。 –

它似乎在工作，它只是您選擇的緩動非常接近線性：http://jsfiddle.net/QfeL2/。我對照這裏找到的jQuery Easing Plugin進行了檢查：http://gsgd.co.uk/sandbox/jquery/easing/。每當您嘗試使用不存在的緩動方法時，jQuery實際上會在您的控制檯中引發錯誤。您可以通過將緩存更改爲您知道不存在的內容來查看。 – Jasper

你使用jQuery緩動插件http://gsgd.co.uk/sandbox/jquery/easing/？ – mawcsco

也許你錯過了一些微妙的東西。看起來您正在嘗試使用easing插件作爲指導來執行「自定義寬鬆」。我認爲正在發生的事情是，你的動畫持續時間非常短，爲200毫秒。在這個速度下，速度的降低將會非常微妙。嘗試將其擴展到2000（甚至3000）毫秒以查看緩解行動。

此外，easeOutQuad是一個微妙的動畫，因爲它是。當你運行它時不會有戲劇性的效果。爲了學習jQuery緩動的基礎知識，可以嘗試從「easeOutElastic」中獲取算法代碼，並將其放入函數中，以便看到更顯着的效果。這會讓你有信心知道你的代碼正在工作。一旦你確信它正在工作，取出彈性算法並將原件放回原處。

示例代碼：

$.easing.easeOutQuad = function (x, t, b, c, d) { 
    //return -c *(t/=d)*(t-2) + b; 
    var s=1.70158;var p=0;var a=c; 
    if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; 
    if (a < Math.abs(c)) { a=c; var s=p/4; } 
    else var s = p/(2*Math.PI) * Math.asin (c/a); 
    return a*Math.pow(2,-10*t) * Math.sin((t*d-s)*(2*Math.PI)/p) + c + b; 
}; 

$("#view").slideDown(2000,'easeOutQuad');

來源

2012-06-18 15:54:00 mawcsco

我無法弄清楚如何在jQuery中執行緩動操作

回答

相關問題