jQuery中的动画标题

时间:2011-02-13 23:27:42

标签: jquery css image animation slide

我发现这个很酷的jQuery脚本可以为标题设置动画:http://www.devirtuoso.com/2009/07/how-to-build-an-animated-header-in-jquery。但是我想稍微改变它,但不幸的是我的脚本技能有限。

我想要做的是:当动画到达图像的末尾时,我希望它再次向上滚动,而不是像在教程中那样重新开始。所以,基本上图像会不断上下移动。

任何人都知道这会是什么样子,明智的脚本?

此致

1 个答案:

答案 0 :(得分: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/

所有这一切都是在步骤结束时切换步进值。