如何在 jquery 中设置移动限制？

Question

我正在尝试创建乒乓球，并且我已经创建了所有 html、css 和 js 来让球拍移动，但是如何防止它们从外面移动我设置的预定边界？

这是js中右桨存在的代码，使用jquery。

var rightBoard = GameItem("#rightBoard");
  rightBoard.x = BOARD_WIDTH - $('#rightBoard').width()

这是移动代码。

var keycode = event.which;
    if (keycode === KEY.DOWNARROW) {
      rightBoard.velocityY = 5;
    }if (keycode === KEY.UPARROW) {
      rightBoard.velocityY = -5; 
    }

如何设置限制以使其不会超过某个点？我坚持这个，因为这是我的第一个项目。感谢您的帮助。

Answer 1

每次移动球拍时，无论是在设置速度期间还是在实际将速度添加到球拍位置的位置，检查新更新的位置是在边界内还是边界外。如果在里面，那么只更新实际位置。

var keycode = event.which;
    if (keycode === KEY.DOWNARROW) {
      if(rightBoard.y + 5 < BOARD_HEIGHT - Paddle_Height)
           rightBoard.velocityY = 5;
      else
           rightBoard.velocityY = 0;
    }if (keycode === KEY.UPARROW) {
      if(rightBoard.y - 5 > 0)
           rightBoard.velocityY = -5;
      else
           rightBoard.velocityY = 0;
    }

这里我假设桨的原点设置在左上角。

如何在 jquery 中设置移动限制？

How do I set a movement limit in jquery?

jquery

pong