我的任务是为 GoogleTV 的现有 Web 应用程序实现d-pad导航（我正在 Google Chrome 中进行测试，到目前为止它们的操作似乎相似。在他们实现 d-pad 导航的说明中，他们有基本的处理程序、右、左、下并选择。
目前我有一个方案来初始化一个虚拟光标，然后进行各种dpad笔画。我依靠使用document.elementFromPoint()和循环，直到找到一个以前没有选择的新元素。我正在使用outline:css 来指示当前位置，并且仅在选择了其中一个 dpad 控件时才显示它。
我有一个初始化步骤，它将类添加dpadClickable到所有可点击的项目中，然后随着光标的移动，我将其dpadHighlighted添加到新的项目中并从所有其他元素中删除。看起来不错。
如果我有一个可滚动的元素，或者如果方向使得我的点向下移动找不到任何东西，这一切都会失败。
我想要一个数据结构来保存我的所有dpadClickable项目，然后在 d-pad 单击时，能够对其进行迭代以找到最接近的顶部、向下、左侧和右侧元素。就像，我应该根据topandleft属性来做吗？还是基于计算的中心点？
我找到了一个jQuery 库，它实现了这一点，并在某种程度上对其进行了逆向工程。但我真正想要的是这类编程问题的入门知识：我应该寻找图形编程算法吗？游戏？还有什么？
