Javascript Flash画布响应动画大小

Javascript Flash画布响应动画大小,javascript,html,flash,animation,canvas,Javascript,Html,Flash,Animation,Canvas,使用Flash画布构建的动画是否可以在浏览器中响应?我的意思是,我希望画布和动画本身根据浏览器窗口的大小重新调整大小,同时保持原始纵横比 我从发布画布中获得的代码如下,尽管我一整天都在试图弄清楚这一点,但我无法正确地理解它 <script> var canvas, stage, exportRoot; function init() { canvas = document.getElementById("canvas"); exportRoot = new lib.

使用Flash画布构建的动画是否可以在浏览器中响应?我的意思是,我希望画布和动画本身根据浏览器窗口的大小重新调整大小,同时保持原始纵横比

我从发布画布中获得的代码如下,尽管我一整天都在试图弄清楚这一点,但我无法正确地理解它

<script>
var canvas, stage, exportRoot;

function init() {
    canvas = document.getElementById("canvas");
    exportRoot = new lib.test_1();

    stage = new createjs.Stage(canvas);
    stage.addChild(exportRoot);
    stage.update();

    createjs.Ticker.setFPS(lib.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);
}
</script>

var画布、stage、exportRoot;
函数init(){
canvas=document.getElementById(“canvas”);
exportRoot=new lib.test_1();
stage=newcreatejs.stage(画布);
stage.addChild(exportRoot);
stage.update();
createjs.Ticker.setFPS(lib.properties.fps);
createjs.Ticker.addEventListener(“勾号”,阶段);
}


有人能帮我吗?我对java脚本或画布没有太多的经验,而且我更新代码的尝试也没有让我走得太远。在stackoverflow上的另一篇文章的帮助下,我设法让我的画布具有响应性,但动画却没有。动画只是停留在同一地点。提前非常感谢!下面是使我的画布具有响应性的代码(如果有帮助):

<script>
var canvas, stage, exportRoot, myCanvas;

function init() {
    canvas = document.getElementById("canvas");
    exportRoot = new lib.test_1();

    stage = new createjs.Stage(canvas);
    stage.addChild(exportRoot);
    stage.update();

    createjs.Ticker.setFPS(lib.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);

    var myCanvas = document.getElementById("canvas");
    myCanvas.width = document.documentElement.clientWidth;
    myCanvas.height = document.documentElement.clientHeight;

    window.addEventListener("resize", resizeCanvas, false);

    function resizeCanvas (e) {
    var myCanvas = document.getElementById("canvas");

    myCanvas.width = document.documentElement.clientWidth;
    myCanvas.height = document.documentElement.clientHeight;
}

}
</script>

var canvas、stage、exportRoot、myCanvas;
函数init(){
canvas=document.getElementById(“canvas”);
exportRoot=new lib.test_1();
stage=newcreatejs.stage(画布);
stage.addChild(exportRoot);
stage.update();
createjs.Ticker.setFPS(lib.properties.fps);
createjs.Ticker.addEventListener(“勾号”,阶段);
var myCanvas=document.getElementById(“canvas”);
myCanvas.width=document.documentElement.clientWidth;
myCanvas.height=document.documentElement.clientHeight;
addEventListener(“resize”,resizeCanvas,false);
函数大小调整画布(e){
var myCanvas=document.getElementById(“canvas”);
myCanvas.width=document.documentElement.clientWidth;
myCanvas.height=document.documentElement.clientHeight;
}
}

我找到了一个在Adobe论坛上运行的解决方案。虽然不是100%完美,但它确实做到了:

基本上,只需通过CSS进行操作,并在画布上添加100%的宽度,即可正确缩放画布和动画。所以你的画布看起来像这样:

<canvas id="canvas" width="720" height="660" style="background-color:#FFFFFF; width: 100%;"></canvas>
2“2”控制动画的比例,因此,如果将其更改为3(例如),动画现在将被放大。找到一种基于浏览器大小修改的方法会更好,但我个人不具备javascript方面的知识

<canvas id="canvas" width="720" height="660" style="background-color:#FFFFFF; width: 100%;"></canvas>
this.my_anim_container.setTransform(360,329.2,2,2,0,0,0,0,8.6);