如何在单击Javascript时移动图像？

Question

我目前正在制作一个Javascript / HTML / CSS游戏，我需要一个特定的图像，以便在单击该图像时将一个像素移动到一侧。这是我的每个部分的代码：

<input id="test" type="image" src="https://discussions.apple.com/___sbsstatic___/migration-images/200/20011164-1.gif" alt="SUBMIT"></input>

CSS：

#test {
    position: absolute;
    left:10px;
    top:227px;
    z-index: 1;
    width: 50px;
}

JS：

document.getElementById("test").onclick = function () {
    // stuff should hopefully be going here soon!
};

我正在使用Bootstrap和JQuery 2.x（边缘）。

Answer 1

如果你正在使用jQuery，你可以像这样更新元素CSS：

$("#test").on("click",function(){
  $(this).css("left","1px");
});

这是一个简单问题的简单答案。如果你正在制作游戏，可能会有更深入的方法来解决你的机制问题。但这是jQuery语法来做你所要求的。