HTML5 - 画布失去焦点？

我正在用Impact JS进行游戏，它使用画布进行渲染。在游戏中，我有一个按钮，显示一个隐藏的div包含流播放器，并播放视频。在那个隐藏的div也是一个关闭div并停止视频的按钮......这一切都很好。问题是，一旦视频关闭，我必须点击画布才能重新获得焦点。因此，视频下的按钮现在必须点击两次才能使其正常工作......不行。我确定它不是特定于流水游戏。我可以用黑色显示一个隐藏的div，并在5秒内将其隐藏，画布仍然失去焦点。任何人看到这个？这是一个showstopper现在..真的需要得到它的工作。HTML5 - 画布失去焦点？

来源

2013-10-21 David Mennenoh

OK，我去，并添加一个单击处理程序的canvas标签，我发现帆布实际上没有失去焦点 - 因为我当我点击画布时，即使按钮没有回复，也会得到“画布下降”的痕迹。我为此使用了Impact JS游戏引擎，看起来这就是实际上失去焦点 - 虽然它仍然运行良好，因为我的翻滚继续工作。如果有人在意快速浏览一下，我将它放在中转站点上。 http://design.gmrstage.com/dave/chiltest/default.html# 真的很感谢这里的任何帮助。 –

PS - 如果你决定看 - 点击主页上的箭头进入主菜单。点击任意按钮 - 视频将打开 - 点击菜单关闭视频。按钮现在需要两次点击才能工作。 –

我看到您已经将tabindex应用于您的画布。

好，这是需要将焦点设置在画布上。

现在给在影片结束后的画布重点，做到这一点：

// get a reference to the canvas element 

var canvas=document.getElementById('canvas'); 

// set focus to the canvas when the video ends 

canvas.focus().

来源

2013-10-21 20:16:45 markE

这不起作用。那么......它可能，但正如我后面解释的，画布似乎在保持焦点。我在画布标签中添加了点击处理程序，并且该功能被调用 - 即使游戏中的按钮没有响应 - 直到再次点击。 –

PS - 如果再看一次，视频关闭后会看到“画布向下”追踪到控制台，即使该按钮在您再次单击时没有响应。 –

HTML5 - 画布失去焦点？

回答

相关问题