元素拒绝移动- jQuery .css

这里我有一个奇怪的问题。我正在创建一个简单的直升机游戏(老式的类型-点击上升，避免障碍)。我的问题是，障碍物产生，但没有正确的位置，然后他们不会移动。我试图用jQuery的css()移动它们- css方法在其他任何事情上都很好，但当使用top和left时却没有。

问题函数(生成和移动障碍):

game.background.generateObs = function() {
var top = Math.floor(Math.random()*game.canvas.height);
var left = game.canvas.width-10;
var $obs = $("<div></div>")
$obs.addClass("obs").appendTo("#canvas");
$obs.css({
    background: "black",
    position: "absolute",
    height: game.obstacle.height,
    width: game.obstacle.width,
});
$obs.css("top", $("#canvas").offset().top  + top )
    .css("left",$("#canvas").offset().left + left);
game.obstacle.width = Math.floor(Math.random()*200);
if(game.gameState=="running") {
    setTimeout("game.background.generateObs()",obsInterval);
}
else {
    return;
}
}
game.background.moveObs = function() {
var currentPos = $("#canvas div.obs").css("left");
var newPos = currentPos - game.obstacle.frameWidth;
$("#canvas div.obs").css("left",newPos);
if(game.gameState=="running") {
    setTimeout("game.background.moveObs()",interval);
}
else {
    return;
}
}

另一件事是，jsFiddle现在告诉我，game是未定义的，当我在开始的时候定义它。