3

I'm testing out Swiffy, and plugging it into Zurb's Foundation responsive framework. It all works well. I also updated the CSS for the #swiffycontainer container to have a width of width: 100%;.

The content fits nicely into the grid, but the my only issue is that if the size isn't set explicitly, then on a smaller screen, then, I get this issue with the height being way way larger than the content, even with height set at 500px. This also results in the Swiffy container showing contents outside of the stage.

Any ideas as to why? Would it be with the SVG generated from Swiffy? Thanks!

Update: It seems that this is probably related to AS 2/3's stageScale property on the Stage. Would anybody happen to know of a happy medium between "showAll/SHOW_ALL", and "noBorder/NO_BORDER"? Where the stage still resizes but doesn't show a border around it?

4

2 回答 2

3

我最终用一点 CSS 解决了这个问题，确保高度与宽度成比例缩放（由于响应式网格，它可能是什么宽度）。这可以防止 flash/Swiffy 容器创建信箱栏。

在 SWF 中：保留默认值 (AS2)：

Stage.scaleMode = "noScale";

在 CSS 中，在 Swiffy 容器上创建了一个包装器：

.swiffy-wrap { 
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  float: left;
  height: 0;
}

在 Swiffy 容器上

#swiffycontainer {
  width : 100% !important;
  height: 100% !important;
  position: absolute;
  left: 0;
}
于 2013-12-12T01:22:49.230 回答
2

只需放入快速转换的html结果宽度100%注意只有宽度而不是高度，高度，像这样

div id="swiffycontainer" style="width: 100%; height: 500px"

为我工作

于 2014-02-13T11:24:30.250 回答