jQuery - nekonečné presúvanie obrázka na pozadí až do výšky - pohyb, pohyb

Snažím sa vytvoriť jednoduchú automobilovú závodnú hru a chcem nekonečne posúvať obrázok na pozadí nadol dole. Momentálne mám obrázok pozadia cesty.

<script>
jQuery(document).ready(function($) {
var animate = $("body");
function loopbackground() {
animate.css("background-position", "0px 0px");
$({position_x: 0, position_y: 0}).animate({ position_y: -2500}, {
duration: 12000,
easing: "linear",
step: function() {
animate.css("background-position", this.position_x+"px "+this.position_y+"px");
},
complete: function() {
loopbackground();
}
});
}
loopbackground();
});
</script>

ale obraz ide hore a nikdy neklesá.

odpovede:

Najprv by ste mali povoliť jQuery vo vašom jsfiddle. Atribúty CSS môžete animovať, takže umožníme definovať falošné. Ak ste vytvorili plynulé pozadie a nastavili presné rozmery, bude to nekonečné valcovanie.

var body = $("body");
function loopbackground() {
body.css("background-position", "0 0");
body.css("y_pos", 0);
body.animate({"y_pos": -2500}, {
duration: 12000,
easing: "linear",
step: function(now, obj) {
var element = $(obj.elem);
element.css("background-position", "0px " + now + "px");
},

complete: function() {
loopbackground();
}
});
}
loopbackground();