边缘动画:使用javascript播放动画
我已禁用“边缘动画合成”中的“自动播放”选项。 现在我想用waypoints.js绑定这些动画,所以我需要通过javascript调用动画 这是我的HTML边缘动画:使用javascript播放动画,javascript,jquery,html,animation,adobe-edge,Javascript,Jquery,Html,Animation,Adobe Edge,我已禁用“边缘动画合成”中的“自动播放”选项。 现在我想用waypoints.js绑定这些动画,所以我需要通过javascript调用动画 这是我的HTML <div id="StageTwo" class="EDGE-4436041"></div> 这是Javascript <script> AdobeEdge.loadComposition('animation_bereitstellung', 'EDGE-4436041', { sc
<div id="StageTwo" class="EDGE-4436041"></div>
这是Javascript
<script>
AdobeEdge.loadComposition('animation_bereitstellung', 'EDGE-4436041', {
scaleToFit: "both",
bScaleToParent: "true",
centerStage: "horizontal",
minW: "0px",
maxW: "undefined",
width: "650px",
height: "463px"
}, {"dom":{}}, {"style":{"${symbolSelector}":{"isStage":"true","rect":["undefined","undefined","500px","356px"],"fill":["rgba(255,255,255,1)"]}},"dom":{}});
</script>
AdobeEdge.loadComposition('animation_Bereittellung'、'EDGE-4436041'{
scaleToFit:“两者”,
bScaleToParent:“正确”,
中央舞台:“水平”,
minW:“0px”,
maxW:“未定义”,
宽度:“650px”,
高度:“463px”
},{“dom”:{},{“style”:{“${symbolSelector}”:{“isStage”:“true”,“rect”:[“undefined”,“undefined”,“500px”,“356px”],“fill”:[“rgba(255255255,1)”]},dom:{};
问题:我在一个站点上有多个动画。我认为最简单的方法是使用bootstrapCallback调用Adobe Edge API,方式类似于以下:
var waypoint = new Waypoint({
element: document.getElementById('basic-waypoint'),
handler: function() {
window.AdobeEdge.bootstrapCallback(function(compId) {
var comp = AdobeEdge.getComposition("EDGE-4436041");
//either to play the stage
var stage = comp.getStage().play();
//or to play a symbol inside the stage
var mySymbol = comp.getStage().getSymbol("symbol");
mySymbol.play();
});
}
});
希望有帮助