Question

我正在尝试此代码。当点击div时，它应该生成一个图像并将其容器p设置为全屏。

<html>
<head>
<style>
img { height: 643px; width: 860px; }
img:-moz-full-screen { height: 643px; width: 860px; }
div:-moz-full-screen { background: white; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(function() {
 $("p").click(function() {    
  setTimeout(function() {
    $("body").prepend("<div><img src = 'http://i.stack.imgur.com/lBZKC.jpg?s=128&g=1' /></div>");
    $("div").get(0).mozRequestFullScreen();
  },5000);
 });
});
</script>
</head>
<body>
<p>Foo</p>
</body>

它的作用是wiat 5秒并且图像前置正确，但它没有设置为全屏。但是，如果您删除计时器并正常执行：

$("p").click(function() {
  $("body").prepend("<div><img src = 'http://i.stack.imgur.com/lBZKC.jpg?s=128&g=1' /></div>");
  $("div").get(0).mozRequestFullScreen();
});

它工作正常，它会预先设置图像并立即将其设置为全屏。

这是故意还是错误？无论哪种方式，有没有办法让它发挥作用？

Answer 1

必须调用该方法以响应用户输入事件（即keypress，mouseevent）。

在计时器内设置时，HTML5全屏不起作用

1 个答案: