Adobe Edge Animate CC 文件结构层次结构 - 如何从不同的文件夹位置加载资源和图像(2014.1.1 版)
Adobe Edge Animate CC file structure hierarchy - how to have assets and images load form different folder locations (2014.1.1 release)
这更像是我自己找到的解决方案,而不是一个问题。在这个问题的帮助下:Edge Animate files not working in CMS。
(the above has a good solution but it is for an older Edge Animate and the tile might not help users looking for this specific fix)
我一直在寻找一种方法来重组我的 Edge Animate 文件以用于托管服务器,并且不会弄乱服务器结构。
例如:将所有动画文件和资源放在一个动画文件夹中。
根目录/:
- 图片/
- 包括/
- 动画/
- 样式/
- index.html
- and_so_on.html
如果您不使用或不能使用 .oam 文件,而不是像默认情况下那样将所有资产转储到根目录中。
这就是我所做的:
- 您在您的服务器或测试文件夹中创建一个 animations 文件夹(这可以有一个子目录,如 animation1、animation2 等等)。
- 将图像文件夹粘贴到 animations 文件夹(从 Edge 动画项目文件夹或发布文件夹)。
- 粘贴您的 edge_includes 文件夹。
- 粘贴您的 "animation"_edge.js 文件。
- 粘贴您的 "animation".html 文件(这不是必需的,但我在根目录 html 的头部粘贴 Adobe Edge Runtime 代码时从该文件开始工作) .
- 粘贴你的 stylesheet.css.
- 如果您使用自定义字体,也不要忘记添加任何字体文件。
步骤 1 您需要从动画文件夹中 "animation".html 的头部复制一些代码并将其粘贴到您希望显示动画的 "product".html 页面(在根文件夹中)。
复制"animation"的head <!--Adobe Edge Runtime--> . . . <!--Adobe Edge Runtime End-->
中的代码。html并粘贴到你想要的html的head中出现:products.html
从 "animation".html 复制 <div id="Stage" class="EDGE-1234123"> .... </div>
并将 div 粘贴到 "products".html 您希望它出现的位置。
将位于 head <script type="text/javascript" charset="utf-8" src="edge_includes/edge.5.0.1.min.js"></script>
中的 Adobe Edge Runtime 代码更改为
<script type="text/javascript" charset="utf-8" src="animations/animation1/edge_includes/edge.5.0.1.min.js"></script>
将AdobeEdge.loadComposition('animation', 'EDGE-4297215',..
改为
AdobeEdge.loadComposition('animations/animation1/animation', 'EDGE-4297215',..
将["rgba(0,0,0,0)",'images/animation.png','0px','0px']
改为
["rgba(0,0,0,0)",'animations/animation1/images/animation.png','0px','0px']
(这是 poster 图像)
"animation"_edge.js 文件中的步骤 2:
将var im='images/',
改为
var im='animations/animation1/images/',
将'<link rel=\"stylesheet\" href=\"stylesheet.css\" type=\"text/css\" media=\"screen\" title=\"\" charset=\"utf-8\" />'
改为
'<link rel=\"stylesheet\" href=\"animations/animation1/stylesheet.css\" type=\"text/css\" media=\"screen\" title=\"\" charset=\"utf-8\" />'
这些是我遵循的步骤,它们对我有用,不知道还有什么方法 post 请随时发表评论,更正 ;D as
这更像是我自己找到的解决方案,而不是一个问题。在这个问题的帮助下:Edge Animate files not working in CMS。
(the above has a good solution but it is for an older Edge Animate and the tile might not help users looking for this specific fix)
我一直在寻找一种方法来重组我的 Edge Animate 文件以用于托管服务器,并且不会弄乱服务器结构。
例如:将所有动画文件和资源放在一个动画文件夹中。
根目录/:
- 图片/
- 包括/
- 动画/
- 样式/
- index.html
- and_so_on.html
如果您不使用或不能使用 .oam 文件,而不是像默认情况下那样将所有资产转储到根目录中。
这就是我所做的:
- 您在您的服务器或测试文件夹中创建一个 animations 文件夹(这可以有一个子目录,如 animation1、animation2 等等)。
- 将图像文件夹粘贴到 animations 文件夹(从 Edge 动画项目文件夹或发布文件夹)。
- 粘贴您的 edge_includes 文件夹。
- 粘贴您的 "animation"_edge.js 文件。
- 粘贴您的 "animation".html 文件(这不是必需的,但我在根目录 html 的头部粘贴 Adobe Edge Runtime 代码时从该文件开始工作) .
- 粘贴你的 stylesheet.css.
- 如果您使用自定义字体,也不要忘记添加任何字体文件。
步骤 1 您需要从动画文件夹中 "animation".html 的头部复制一些代码并将其粘贴到您希望显示动画的 "product".html 页面(在根文件夹中)。
复制"animation"的head
<!--Adobe Edge Runtime--> . . . <!--Adobe Edge Runtime End-->
中的代码。html并粘贴到你想要的html的head中出现:products.html从 "animation".html 复制
<div id="Stage" class="EDGE-1234123"> .... </div>
并将 div 粘贴到 "products".html 您希望它出现的位置。将位于 head
<script type="text/javascript" charset="utf-8" src="edge_includes/edge.5.0.1.min.js"></script>
中的 Adobe Edge Runtime 代码更改为
<script type="text/javascript" charset="utf-8" src="animations/animation1/edge_includes/edge.5.0.1.min.js"></script>
将
AdobeEdge.loadComposition('animation', 'EDGE-4297215',..
改为
AdobeEdge.loadComposition('animations/animation1/animation', 'EDGE-4297215',..
将
["rgba(0,0,0,0)",'images/animation.png','0px','0px']
改为
["rgba(0,0,0,0)",'animations/animation1/images/animation.png','0px','0px']
(这是 poster 图像)
"animation"_edge.js 文件中的步骤 2:
将
var im='images/',
改为
var im='animations/animation1/images/',
将
'<link rel=\"stylesheet\" href=\"stylesheet.css\" type=\"text/css\" media=\"screen\" title=\"\" charset=\"utf-8\" />'
改为
'<link rel=\"stylesheet\" href=\"animations/animation1/stylesheet.css\" type=\"text/css\" media=\"screen\" title=\"\" charset=\"utf-8\" />'
这些是我遵循的步骤,它们对我有用,不知道还有什么方法 post 请随时发表评论,更正 ;D as