14

我环顾互联网，一直在寻找一个可以在显示实际加载屏幕的同时加载 Flash 内容/游戏的脚本，但我总是收到一些答案：

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

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

如您所见，我希望该脚本与 %ages 一起工作，这是我的问题，但正如我之前提到的，我没有立即来到这里，我在过去几个月的 14 个论坛中一直在寻求帮助（实际上是在乞求）当然有些好人仍然存在有些人帮助我达到了某个点（但它没有解决问题）所以现在我将提供一些标记：

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

这是工作示例的链接（基于像素的闪存） 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
信用：去找回答这个问题的人。

4

3 回答 3

2

这似乎只是一个纯粹的 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;
}
于 2012-05-01T16:07:20.777 回答
0

好吧，在您的链接上玩了一个半小时的Bloons之后（我的未受影响的工作量可以验证这一点），我觉得可以肯定地说全屏功能完全按照我的预期工作。我正在使用 Chrome 18.0.x。

我的经验是：点击链接，游戏加载。加载程序需要大约 2 秒的时间才能完成，然后才出现“单击此处显示游戏”按钮。之后，一个广告出现了 10 秒，然后我点击“播放”，它直接进入了游戏。据我所知，全屏工作正常，但当我离开全屏时，游戏并没有重新调整大小——底部被切断了。

我知道这不能回答您的问题，但也许问题仅存在于某些浏览器中？

于 2012-05-01T15:33:36.563 回答
0

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

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

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

于 2012-05-01T16:02:10.980 回答