0

我在让我的调整大小事件同步时遇到了一些麻烦。基本上， $M.resize 会更新 div 的宽度（css），然后我希望 $API.resize 读取新的大小并相应地更新其元素。但是，如果我设置窗口调整大小事件（见下文），然后立即触发窗口的调整大小事件，$API.resize 不会获得任何新的宽度信息——几乎就像 $M.resize 还没有完成更新一样。$API.resize 通过 $("#main").css("width"); 获取新的宽度信息 我可以让它工作的唯一方法是使用下面的解决方法 setTimeout .. 有没有更好的方法来做到这一点？

// on page load
$(function () {
    $(window).resize(function () {
        $M.resize();
        $API.resize();
    });
    setTimeout(function () {
        $(window).resize();
    }, 100);
});

// $API.resize
function () {
    var pageWidth = $M.width();
    console.log("pageWidth = " + pageWidth);
    $("#atmoGrid").css("width", pageWidth);
    $(".atmoSector")
        .css("width", pageWidth/5-2)
        .css("height", pageWidth/5-2);
}

// $M.resize
function () {
    // refresh screen dimensions
    width = Math.min(screen.availWidth, window.innerWidth);
    height = Math.min(screen.availHeight, window.innerHeight);
    smallScreen = (width < smallWidth);
    fontScale = (smallScreen) ? 3 : 1;

    // check if screen is small
    if (smallScreen) {
        $("#main").css("width", "100%");
    } else {
        $("#main").css("width", smallWidth + "px")
    }
    $("#main").css("font-size", $M.font(18));
}

// $M.width
function () {
    var width = $("#main").css("width");
    return parseInt(width);
}
4

1 回答 1

0

尝试这个：

// on page load
$(function () {
    $(window).resize(function () {
        $M.resize();
    });
});

// $API.resize
function (mWidth, mHeight) {
    var pageWidth = mWidth;
    console.log("pageWidth = " + pageWidth);
    $("#atmoGrid").css("width", pageWidth);
    $(".atmoSector")
        .css("width", pageWidth/5-2)
        .css("height", pageWidth/5-2);
}

// $M.resize
function () {
    // refresh screen dimensions
    width = Math.min(screen.availWidth, window.innerWidth);
    height = Math.min(screen.availHeight, window.innerHeight);
    smallScreen = (width < smallWidth);
    fontScale = (smallScreen) ? 3 : 1;

    // check if screen is small
    if (smallScreen) {
        $("#main").css("width", "100%");
    } else {
        $("#main").css("width", smallWidth + "px")
    }
    $("#main").css("font-size", $M.font(18));

    $API.Resize(smallWidth, someheight);
}

// $M.width
function () {
    var width = $("#main").css("width");
    return parseInt(width);
}

hth

于 2012-08-27T04:31:38.417 回答