Question

我真的很擅长使用javascript并使用html，所以请原谅noobness，如果这甚至是一个字。因此，我使用Adobe createJS工具包来显示图形（exportRootTitle），而加载栏显示preloadJS的进度。我有一个handleComplete函数，然后从stage中删除exportRootTitle并添加另一个exportRoot（这是主要内容）。

我的问题是我需要有两个单独的resize函数，一个在init上，另一个在handleComplete函数上。我尝试过两个这样的听众：

window.addEventListener('resize', resizeTitle, false);
window.addEventListener('resize', resizeMain, false);

它似乎不起作用。所以我想也许有一种方法可以通过使用＆＃34; if-else＆＃34;来调整resize函数的条件。也许类似于如果触发了handleComplete，resize函数将用于exportRoot，但如果还没有，则它可以用于exportRootTitle，或类似的东西。我有一个想法，但我对如何执行毫无头绪。

我真的不擅长解释，所以请看一下我的代码。

var canvas, stage, exportRoot;

window.addEventListener('resize', resizeTitle, false);

function init() {
canvas = document.getElementById("canvas");
images = images||{};

var manifest = [
    {src:"images/apple.png", id:"apple"},
    {src:"images/bag.png", id:"bag"},
    {src:"images/car.png", id:"car"},
    {src:"images/drum.png", id:"drum"},
    {src:"images/egg.png", id:"egg"},
    {src:"images/flower.png", id:"flower"},
    {src:"images/gift.png", id:"gift"},
    {src:"images/house.png", id:"house"}
];

var loader = new createjs.LoadQueue(false);
loader.addEventListener("fileload", handleFileLoad);
loader.addEventListener("complete", handleComplete);
loader.loadManifest(manifest);

loader.addEventListener("progress", handleProgress);
stage = new createjs.Stage(canvas);
exportRootTitle = new lib.LoaderTitle();
exportRootTitle.regX = canvas.width/2;
exportRootTitle.regY = canvas.height/2;

var progress = new createjs.Shape();
var progressLine = new createjs.Shape();

progressLine.graphics.setStrokeStyle(2).beginStroke("#CCCCCC").drawRect(175,349,550,10);

function handleProgress(event) {
progress.graphics.clear();
progress.graphics.beginFill("#0B9CFD").drawRect(175,349,550*(event.loaded / event.total),10);
exportRootTitle.LoadingInfo.text = ((100*(event.loaded / event.total)).toFixed() + "%");
}

exportRootTitle.addChild(progressLine, progress);
stage.addChild(exportRootTitle);
stage.update();
createjs.Ticker.setFPS(24);
createjs.Ticker.addEventListener("tick", stage);
resizeTitle();
}

function handleFileLoad(evt) {
if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete() {
stage.removeChild(exportRootTitle);
exportRoot = new lib.LoaderContent();
exportRoot.regX = canvas.width/2
exportRoot.regY = canvas.height/2
stage.addChild(exportRoot);
stage.update();
createjs.Ticker.setFPS(24);
createjs.Ticker.addEventListener("tick", stage);
}

function resizeTitle() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;         

exportRootTitle.x = canvas.width/2;
exportRootTitle.y = canvas.height/2;

var adjustTitle = (window.innerHeight/600)*1;
exportRootTitle.scaleX = exportRootTitle.scaleY = adjustTitle;
}

感谢任何想要帮助的人，我真的很感激。

使用带有window resize eventlistener / handler的条件

0 个答案: