1

嘿，大家对整个 JS 和 JQuery 场景都很陌生，需要一点帮助。进行了几次搜索，但我找不到解决方案或忽略了它（甚至错误地实现了它）。

我使用 CreateJS 创建了一个站点，并设法使调整大小工作得很好（使用我在这里找到的一个小 JQuery）。但是，该代码仅适用于调整大小，而不是当我以最小化状态加载浏览器窗口时（基本上加载整个画布，就好像它是全屏的，切断了站点）。

我试图让这个网站在任何分辨率和移动设备上都可以自动查看。这是我正在使用的代码，一些方向会很棒！

<script>
var canvas, stage, exportRoot;



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

var manifest = [
    {src:"images/Bitmap1.png", id:"Bitmap1"},
    {src:"images/Bitmap2.png", id:"Bitmap2"},
    {src:"images/Bitmap3.png", id:"Bitmap3"},
    {src:"images/Bitmap4.png", id:"Bitmap4"},
    {src:"images/facebook.png", id:"facebook"},
    {src:"images/mainbg.jpg", id:"mainbg"},
    {src:"images/mainbglarge.jpg", id:"mainbglarge"}
];

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


//resize jquery
(function($){
  $(window).resize(function(){
    windowResize();                      
  });         
})(jQuery);

function windowResize(){
   stage.canvas.width = window.innerWidth;
   stage.canvas.height = window.innerHeight;    
   var test = (window.innerWidth/1680)*1; 
   exportRoot.scaleX = exportRoot.scaleY = test;
}

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

function handleComplete() {
    exportRoot = new lib.strikersite_html5Resize();

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

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

我基本上是使用带有 Jquery 元素的常规 Javascript，因此考虑到这段代码，这两种方法都会受到赞赏！谢谢！

4

2 回答 2

0

要手动触发调整大小事件似乎是一种 hack，我会在 load 或 ready 事件上调用该函数。

调用windowResize()窗口加载或文档准备就绪：

$(window).load(windowResize());

窗口加载和文档就绪之间的区别在于，窗口加载在所有内容、资产和文档都已加载时触发。当文档准备好被操作时，document ready 就会触发。也就是说，如果您需要等待图像计算画布上的尺寸，请使用窗口加载，否则只需准备好文档就可以了。

于 2013-05-02T08:23:43.410 回答
0

如果我正确理解了您的问题，请尝试在加载时触发调整大小事件。只需将其放在“脚本”块的末尾即可。

$(function() {
    $(window).trigger('resize');
});
于 2013-05-02T08:25:19.423 回答