Jquery 如何在更改的窗口大小上正确放置元素

我有一个元素，我想把左边的边距设为101px。我用下面的代码做了这个

$(document).ready(function(){
    if(document.getElementById('minimize-view-id').checked){
         $("#modal-dialog").css("right", "101px");
    }
});

这在全尺寸窗口中运行良好，但当我最小化窗口并刷新元素时，元素没有正确放置

我怎样才能做到这一点

演示：

• 注意：这是基本代码；由于您正在刷新页面，因此需要使用coockie之类的工具来跟踪复选框，否则代码将无法正常工作

因此，伪代码可以如下所示：

$(function(){
    function doResize() {
       if($('#minimize-view-id').checked){
            $("#modal-dialog").css("right", "101px");
        }
    }
    $(window).resize(function(){
        doResize();
    });
    doResize();
});

当用户选中复选框时，将其保存在coockie上，然后当页面 加载检索coockie并应用css

在我的代码中，我使用了这个插件

您可以使用此方法使其工作。如果要从左边距

101px

放置元素，只需按如下操作：

$(function(){
    function doResize() {
       if($('#minimize-view-id').checked){
            $("#modal-dialog").css("right", "101px");
        }
    }
    $(window).resize(function(){
        doResize();
    });
    doResize();
});

但是，如果要根据窗口宽度动态放置元素，则可以通过选中：

---

希望这能对您有所帮助。

也显示一些html，并检查

控制台错误。@Soham Shetty:查看我的答案，并检查演示是否正常……当我刷新时出现问题。不无提神。例如，当我加载页面时，我有一个元素的css（右，101px）。当我调整和刷新它的大小时，它不工作，元素从左边来。从最小化到最大化也会发生同样的事情如果是这样的话，那么将
$（window）.resize（）中的所有代码都放在一个函数中，并在页面加载中调用它。更新了我的答案，请检查！添加新插件不在我的应用程序中hand@Soham谢蒂：你什么意思？如果您不能从html页面中包含它，只需将上面插件的源代码添加到代码中，这是唯一的方法。@Soham Shetty:请查看更新的源代码并告诉我。
$(function(){
    function doResize() {
       var widthScreen = $( window ).width();
        if($('#minimize-view-id').checked){
            // Define your right margin as per widthScreen size and then assign that value in below code in place of `101px`
            $("#modal-dialog").css("right", "101px");
        }
    }
    $(window).resize(function(){
        doResize();
    });
    doResize();
});