jQuery-对话框删除窗口大小

Question

我正在开发一个快速响应的网站。我必须创建一个窗口大小小于480px的弹出窗口，但对于桌面大小，内容必须是可见的（不在弹出窗口内）。我试图不再重复两次内容。

这是a fiddle link。

$(document).ready(function() {
    $(window).resize();
    $("#filterOpen").click(function() {
        $("#mobileFilter").dialog("open");

    });
});

$(window).resize(function() {
    if ($(window).width() > 480) {
        $("#mobileFilter").dialog({
            autoOpen: false,
            dialogClass: "test",
            modal: false,
            responsive: true
        });
    } else if ($(window).width() > 481) {
        $("#mobileFilter").dialog().remove();
    }
});

提前致谢。

Answer 1

我得到了它的工作。以下是代码。

 $(document).ready(function() {
                $(window).resize();
                $( "#filterOpen" ).click(function() { 
                $( "#mobileFilter" ).dialog( "open" );

    });
            });

$(window).resize(function() {
        if ($(window).width() > 480) {
                $( ".ui-dialog" ).dialog().remove();

        }else if ($(window).width() < 480) {
             $("#mobileFilter").dialog({
                autoOpen: false,
                dialogClass: "test",
                modal: false,
                responsive: true
            });

        }
  });