0

问候。

我正在为 Flash-HTML 混合网站开发一个动画主页，为了标准，我的解决方案被证明是困难的。我不是 Javascript 专业人士，因此不胜感激！

这是破败：

对于 Flash 用户，HTML 页面加载可变高度的 AS3 Flash 电影，该电影将从556 像素高开始，在完成其动画序列后，通过 Actionscript + JavaScript 补间到250 像素高。

为了开始这个电影序列—— （左下） ——我试图通过 MooTools 设置 Flash 电影的初始高度，所以如果用户没有启用 Flash 或 Javascript，他们将看到较短高度的图像区域显示替代图像内容和 HTML 内容（右下）。

Element.setStyle设置高度很好，直到 swfObject 运行，此时电影崩溃，因为我没有通过 CSS 指定高度。如果用户没有 Flash，则默认为静态图片的高度。

所以这是我的问题：有谁知道如何将高度变量设置为宽度/高度@ 100% 时动态传递给 swfobject？我是否会无缘无故地尝试使用两个页面高度？

图像序列：
左 -初始 Flash 影片，下方有 HTML 导航
右 -调整大小的影片在序列末尾，下方有 HTML 导航和内容，看起来与非 Flash 版本相同（静态图像）

替代文字 http://client.deicreative.com/op/images/twopages.jpg

                                           ^^ should land here for users w/o Flash

<script type="text/javascript">
  <!--
  window.addEvent('domready', function() {
     $('flashContent').setStyle('height', 556); // sets height for initial movie
     $('homeContent').setStyle('display', 'none'); // hides homepage text + photos below
     doSwfObject(); // attempting to start swfObject after setStyle is done
  });
  function resizePage(h) { // to be called from AS3
   var tweenObj = new Fx.Tween('flashContent');
   tweenObj.start('height', h);
  }
  function doSwfObject(){
   var flashvars = {};
   var params = { scale: "noScale" };
      var attributes = { id: "flashContent", name: "flashContent" };
   swfobject.embedSWF("swf/homeMovie.swf", "flashContent", "100%", "100%", "9.0.0", false, flashvars, params, attributes);
   alert(document.getElementById('flashContent').style.height); 
   // alerts & shows correct height, but page collapses after hitting 'ok'
  }
  //-->
</script>
4

4 回答 4

2

最简单的解决方案是将 SWF 嵌入到包装器 DIV 中。将 SWF 设置为包装器 DIV 的 100% 宽度/高度，然后使用 JS 调整包装器 DIV 的大小，而不是<object> 本身。这样马车少了。

由于 SWFObject 2 将目标 DIV 替换为对象，因此您需要在标记中添加一个 div：

<div id="wrapper">
   <div id="flashcontent"></div>
</div>

变成

<div id="wrapper">
   <object id="flashcontent" width="100%" height="100%" (etc.) ></object>
</div>
于 2009-11-14T08:23:05.550 回答
1

我认为在这里发布一些东西有助于我思考问题——这样做之后，答案变得更加清晰。因此，对于以后偶然发现此问题的任何人，这是我的解决方案。

为了将 Flash 电影的高度设置为其初始较高状态，同时为非 Flash 用户保留较短的高度（参见上图），我使用 JavaScript 的方式与在序列完成后补间电影高度的方式相同。结果类似于报纸网站上的下推式广告。

在 AS3 中，预加载完成后，我告诉 Javascript 对 Flash 电影容器的高度进行补间（很明显——没有预加载代码）：

package {
   import flash.display.MovieClip;
   import flash.display.StageAlign;
   import flash.display.StageScaleMode;
   import flash.external.ExternalInterface;

    public class HomeMovie extends MovieClip {

       private var stageHeight:uint;

       public function HomeMovie(){

           this.stage.scaleMode = StageScaleMode.NO_SCALE;
           this.stage.align = StageAlign.TOP_LEFT;

           stageHeight = 556;
           // Tell javascript the stage needs resizing.
           if (ExternalInterface.available) {
           ExternalInterface.call("resizePage", stageHeight);
           }
        }
    }

}

在 JavaScript 中（通过 MooTools）：

<script type="text/javascript">
<!--
window.addEvent('domready', function() { // hide content on home-page below movie
   $('homeContent').setStyle('display', 'none');
});
function resizePage(h) {
    var tweenObj = new Fx.Tween('flashContent', {
        property:'height',
        duration:500,
        transition:Fx.Transitions.Quad.easeOut
    });
    tweenObj.start(h);
}
//-->
</script>

我可能会更进一步，在隐藏主页内容之前检查 Flash，这样如果用户有 Javascript 但没有 Flash，就不会发生这种情况。同样，这一切都是为了标准。

于 2009-11-13T18:58:34.060 回答
0

你试过 SWFForceSize吗？这是一个 SWFObject 插件，它可以帮助你。即使您不使用它，也可以查看源代码以了解它们的工作方式。

于 2009-11-13T04:03:15.283 回答
0

顺便说一句，您在使用 Mootools 时不需要 SWF 对象，因为它有一个名为 Swiff 的调用，它可以完成 SWFObject 所做的一切，然后是一些！:D

于 2009-12-03T09:37:15.267 回答