2011-02-13 50 views
0

我發現了這個很酷的jQuery腳本,用於動畫標題:http://www.devirtuoso.com/2009/07/how-to-build-an-animated-header-in-jquery。不過,我想稍微改變一下,但不幸的是我的腳本編寫技巧是有限的。jQuery中的動畫標題

我想要做的是:當動畫到達圖像的末尾時,我希望它再次向上滾動,而不是像教程中那樣重新開始。所以,基本上圖像會不斷上下移動。

任何人都知道如何看起來像腳本明智嗎?

問候

回答

0

嘗試改變scrollBg()函數來此:

function scrollBg(){ 

//Go to next pixel row. 
current -= step; 

//If at the end of the image, then go to the top. 
if (current == restartPosition){ 
    step = -1; 
} else if (current == 0) { 
    step = 1; 
} 

//Set the CSS of the header. 
$('#header').css("background-position","0 "+current+"px"); 
} 

這裏是一個非常基本的工作示例(只用於演示目的 - 用上面的代碼):http://jsfiddle.net/lukemartin/u2XJ8/

所有它會在到達週期結束時切換步長值。

+0

謝謝!我正在嘗試類似的東西,但它沒有奏效。你的小片段完美無缺! – Joachim 2011-02-14 11:04:19