Javascript 基于浏览器宽度的元素定位问题

我有一个固定位置的div，我想在浏览器窗口小于1200px时保留位置：0，但在大于1200px时不保留位置。我正在使用这个代码

var $window = $(window);
function checkWidth() {
    var windowsize = $window.width();
    document.write(windowsize);
    if (windowsize < 1200) {
        document.getElementById("DBCIbox").style.left = "0";
    } else {50
        document.getElementById("DBCIbox").style.left = "500px";
    }
}
checkWidth();
$(window).resize(checkWidth);

var$window=$（window）；
函数checkWidth（）{
var windowsize=$window.width（）；
document.write（窗口大小）；
如果（窗口大小<1200）{
document.getElementById（“DBCIbox”）.style.left=“0”；
}其他{50
document.getElementById（“DBCIbox”）.style.left=“500px”；
}
}
检查宽度（）；
$（窗口）。调整大小（选中宽度）；

但它似乎什么也没做。我将left=500px设置为一个简单的测试，以使javascript正常工作，然后我将担心我要将其放置在何处

我做了一些谷歌搜索，从我所知道的，这应该是工作，我错过了什么

如果有办法清除左边的位置，我也想知道

var $window = $(window);

该行正在缓存该窗口实例。每次调用此代码以获取更新的宽度和高度值时，都需要重新计算

$（窗口）

更新代码如下

function checkWidth() {
    var $window = $(window);
    var windowsize = $window.width();
    document.write(windowsize);
    if (windowsize < 1200) {
        document.getElementById("DBCIbox").style.left = "0";
    } else {50
        document.getElementById("DBCIbox").style.left = "500px";
    }
}

checkWidth();

$(window).resize(checkWidth);

函数checkWidth（）{
变量$window=$（window）；
var windowsize=$window.width（）；
document.write（窗口大小）；
如果（窗口大小<1200）{
document.getElementById（“DBCIbox”）.style.left=“0”；
}其他{50
document.getElementById（“DBCIbox”）.style.left=“500px”；
}
}
检查宽度（）；
$（窗口）。调整大小（选中宽度）；

@jnatazia做对了，我需要做一些调整，这些评论不允许我发布代码，但答案要归功于@jnatazia

   function checkWidth() {
        var $window = $(window);
        var windowsize = $window.width();
        var position;       
        if (windowsize < 1390) {
            document.getElementById("DBCIbox").style.marginLeft = 0 + "px";
        } else if (windowsize >= 1390) {
            position = windowsize - 1060;
        position = position / 2;
        position = position - 175;
            document.getElementById("DBCIbox").style.marginLeft = position + "px";
        }
    }

    $("document").ready(function(){

       $(window).load(function(){
          checkWidth();
       });

       $(window).resize(function(){
          checkWidth();
       });

    });

函数checkWidth（）{
变量$window=$（window）；
var windowsize=$window.width（）；
var位置；
如果（窗口大小<1390）{
document.getElementById（“DBCIbox”）.style.marginLeft=0+“px”；
}否则如果（窗口大小>=1390）{
位置=窗口大小-1060；
位置=位置/2；
位置=位置-175；
document.getElementById（“DBCIbox”）.style.marginLeft=position+“px”；
}
}
$（“文档”）.ready（函数（）{
$（窗口）。加载（函数（）{
检查宽度（）；
});
$（窗口）。调整大小（函数（）{
检查宽度（）；
});
});

这是什么“}else{50”？“}else{50”是复制粘贴错误。这是“50”不是在我的代码中，显然我需要更好地校对我的帖子。对不起。好吧，我做了那个更改，但是代码仍然不起作用。这个代码甚至在初始页面加载时都不起作用，我的浏览器窗口是1900px，明显比指定的1200大，但div仍然显示在左边：0。最后我找到了这个。对于一些人来说原因我无法更改left属性，但我可以更改margin left属性。我回答了自己的问题，以便发布更新的代码，但大部分代码都是您的，您的回答值得称赞。