Javascript - 在游戏中改变图像位置不起作用

时间:2018-04-20 23:24:29

标签: javascript html css

我是一个业余爱好者html5程序员,没有那么多的经验,我目前正在开发一款需要我拥有移动播放器/图像的游戏。下面的代码的问题是,每当我右键单击播放器时,第一次移动然后再移动。我注意到间隔也没有工作,它只调用一次函数。此外,xNum和yNum变量始终保持为0(注意,每次调用函数时,我都会记录它们)。我不知道我是否解释了我希望代码做得足够好而且如果我没有说对不起。来吧,问你可能有任何问题。谢谢你的时间!

std::vector

1 个答案:

答案 0 :(得分:1)

setTimeout和mousedown事件只触发一次。您可以使用setInterval连续更新字符。然后在按下或释放鼠标时更改速度。

let position = 0
let speed = 0
let cursor = document.getElementById("cursor")

function updatePosition(){
   position += speed
   cursor.style.left = position + 'px'
}

function startWalking(){
   cursor.src = "images/testCursorWalk.gif"
   this.speed = 5
}

function stopWalking(){
   cursor.src = "images/stop.gif"
   this.speed = 0
}

window.addEventListener("mousedown", ()=> startWalking())
window.addEventListener("mouseup", ()=> stopWalking())
setInterval(()=>updatePosition(), 100)