JS/CSS動畫速度相對於對象大小

我有一個JS功能，它以0.5 seconds的速度爲div動畫height。此height值動態定義在內容負荷，並且它可以是從200px任何地方6000px以上。JS/CSS動畫速度相對於對象大小

我遇到的問題是，當height大於800px我的默認速度值0.5 seconds使動畫發生的方式太快。如果我將默認速度值增加到2 seconds，則當div高於800px時，動畫會變得太慢。

我怎樣才能使相對DIV高度動畫速度，使動畫的感覺相同，而高度值嗎？

我已經試過這樣：Calculate coefficient to get normal speed animation 。但我得到以下錯誤： ReferenceError: Can't find variable: TimeSpan

，如果任何人有任何想法，我會很感激的 - 在此先感謝

來源

2016-07-11 unwork

如果你直接使用這個問題的答案的問題，那麼TimeSpan對象將不存在你的代碼，除非你創建了它，它不是一個jQuery或JavaScript原生函數，而是一個Microsoft .NET函數。

您可以實現在JS類似的東西，像這樣：

var contentControlHeight = 500; 
var pixelPerSecondSpeed = 30; 
var thisHeight = parseInt($('#someDiv').height()); 

// This should return the correct animation duration 
var duration = (thisHeight - contentControlHeight)/pixelPerSecondSpeed;

我無法測試：如果你從表中你提到的問題，即使用值

var duration = (thisHeight - contentControlHeight)/pixelPerSecondSpeed;

，一個jsFiddle或更多的示例代碼會有所幫助。

來源

2016-07-11 21:57:34

謝謝你這麼多的思南 - 這個偉大的工程。另外感謝你解釋我原始郵件中其他郵件的內容。我懷疑這不是JS特有的方法，但它是我能找到的最接近的相關答案。乾杯。 – unwork

@unwork不用擔心，很樂意提供幫助。你能否將答案標記爲正確？ –

我其實已經衝進了這個思南：它工作不正常，動畫在較短的距離上速度太快，在較長的動畫上速度太慢。今天晚些時候我會在Codepen中創建一個例子。 – unwork

JS/CSS動畫速度相對於對象大小

回答

相關問題