Question

我环顾互联网，并且在过去的6个月里总是看起来像一个可以加载Flash内容/游戏同时显示实际加载屏幕的脚本但是我总是收到一些答案：

无法使用Javascript显示实际加载。
您只能通过向Flash文件添加动作脚本来实现，也许他们正在谈论FLA
为什么不显示出现的虚假加载屏幕并显示一些秒然后消失（这个屏幕最烦人的是他们首先让用户加载15秒然后闪光灯开始加载，如果它开始加载那15秒仍然是值得的什么东西它是好的但是让它们等待加倍真的很糟糕）

但最后我发现了一些我永远在寻找的东西。一个基于Jquery的脚本，显示实际加载（也显示广告），并使用swf对象与Flash内容进行通信。它真的很棒，因为它不需要你对FLA进行更改，它只是纯粹的外部环境处理。所以现在问题就出现了什么问题。那么问题是这个脚本是为像素而制作的，如果你使用宽度和高度为闪光像素，它可以工作，而我不能使用像素，因为我使用％age（这样用户可以选择全屏显示）按f11）。

所以你可以看到我希望那个脚本与我的问题的％年龄一起工作，但正如我之前提到的，我没有立刻来到这里我一直在寻求帮助（实际乞讨）来自14个论坛前几个月，当然还有一些好人仍然存在，有些人帮助我达到某一点（但它没有解决问题）所以现在我将提供一些标记：

以下是我正在讨论的脚本的链接http://www.balloontowerdefense.net/jquery-preloader/jquery-preloader.html（这是该脚本创建者的链接）

以下是工作示例的链接（基于像素的Flash）http://www.balloontowerdefense.net/jquery-preloader/example.html

有些人在这里帮了我，但是1个月前它没用。该人告诉我，我应该更改名为Preroll的插件，首选的更改是

修改插件以使用用户提供的单位而不是像素。为此，您需要修改插件中的两个函数，applygameiframe和showgame。

applygameiframe should be changed to:

var applygameiframe = function() {
  var gc = '#'+settings.gameframe;
  var iframe = $('<iframe />').attr({
    "id": settings.gameid,
    "src": settings.swf,
    "frameborder": 0,
    "scrolling": "no",
    "marginwidth": 0,
    "marginheight": 0
  }).css({
    "height":'settings.height
    "width": settings.width
  });
  $(gc).append(iframe);
  return true;
};

showgame should be changed to:

var showgame = function() {
    var ac   = '#' + settings.adframe;
    var game = '#' + settings.gameframe;
    $(ac).hide();
    $(game).css({
    "width": settings.width,
    "height": settings.height
    });
};

完成这些更改后，内联CSS应设置为您提供的任何参数（即100％，50em等）。

我按照上面所描述的方式对Preroll插件进行了更改，之后我得到的是http://files.cryoffalcon.com/MyFootPrint/fullscreen.html

现在如果你让游戏加载（当加载屏幕出现时）一切都做得很好，除了最后，游戏没有出现，它加载但是当它应该跳过并让游戏出现时错误。（作为参考，当加载完成然后游戏出现时，您可以在此处看到此链接http://www.balloontowerdefense.net/jquery-preloader/example.html

有人可以解决这个问题吗？

注意：很抱歉没有提供JsFiddle，但因为我以5KBps的速度住在阿富汗，所以我不可能。

我没有提供构成整个演示页面的HTML，CSS和JS，因为我认为它会让问题变得很长但是如果你认为我应该提供，请在评论中告诉我。

我尽力使问题与相关标记更相关但仍然如果我遗失了某些东西，我会尽力通过编辑并再次提供给你。

作为一名会计师，我尽力使用程序员的术语，编码是我的热情，但我还处于JS的学习阶段

更新：解决问题后，你可以看到一切都很好。 http://files.cryoffalcon.com/MyFootPrint/newfullscreen.html
图片来源：回答那个回答这个问题的人。

Answer 1

这似乎只是一个纯粹的CSS问题。您尝试将宽度设置为100％，而div.gamewrapper的父级没有宽度或高度。这就是为什么尺寸为0并且不会出现的原因。

您需要应用的技巧是将以下内容添加到您的样式中：

html, body, .gamecontent {
    height: 100%;
    width: 100%;
}

<强>更新另外，从float: left;移除.gamecontent .game，并添加1px的宽度和高度，使其变为：

.gamecontent .game {
    margin:0px auto 0px auto;
    padding:0px;
    overflow:hidden;
    width : 1px;
    height : 1px;
}

Answer 2

好吧，在你的链接上播放Bloons一个半小时之后（我的未触动的工作负载可以验证这一点），我觉得可以说全屏功能完全像我期望的那样工作至。我正在使用Chrome 18.0.x。

我的经历是：点击链接，加载游戏。装载机花费了大约2秒钟完成，然后出现了“点击这里显示游戏”按钮。之后，一则广告出现了10秒，然后我点击了“播放”，然后直接进入游戏。根据我的知识，全屏工作正常，但是当我离开全屏时游戏没有重新调整大小 - 底部被截断了。

我知道这不会回答你的问题，但问题可能只出现在某些浏览器中？

Answer 3

我发现在FF中，问题似乎是100％的高度和宽度。我将脚本稍微改为：

$(game).css({
"width": window.innerWidth,
"height": window.innerHeight
});

现在游戏在FF中正确显示。

在游戏加载时显示广告

3 个答案: