Question

我的问题是我通过我创建的名为createFrame（）的功能加载到js中的应用程序框架。 fullScreen功能无法正常工作，它可以很好地使用全屏幕，但如果我在桌面上移动应用程序框架，即使我将其移回原始位置也无法正常工作。代码更改应用程序框架的大小，并暂时删除顶部的任务栏和用户/时间信息窗格。它似乎也不想允许使用触摸最小化/退出/全屏按钮所在的框。它只是隐藏所有内容并留下空白屏幕。代码的工作原理如下：var app;创建新的应用程序框架（退出/全屏/最小化按钮+内容）。函数第一行中的w和h定义宽度和高度，通过调用createFrame（500,300）在我的名为front-end.js的js文件中调用; 。尽管尚未使用参数，Content_src应该解释自己很容易退出。全屏按钮应该能够如上所述工作，但由于某种原因，如果我在屏幕上拖动它将无法正常工作。现在没关系，因为我没有编写代码将其重新定位到屏幕上的0,0。但是如果我在桌面上将它重新定位到0,0，那么它将不会在屏幕的0,0处结束。我认为这与我的位置有关，即在我移动它之前应用程序不处于可拖动状态。有什么想法吗？

var isFullScreen;

function createFrame(w,h,content_src) {
    var app = $('<div class = "application-frame ui-resizable-se" style="width:'+w+'px; height:'+h+'px;">\
                    <div class = "buttons-box">\
                        <div class = "exit-button">\
                        </div>\
                        <div class = "fullscreen-button">\
                        </div>\
                        <div class = "minimise-button">\
                        </div>\
                    </div>\
                    <div class = "content">\
                    </div>\
                 </div>');  
    var apps = [];
    $(".desktop-box").append(app);
    apps.push(app);
    $(app).draggable({containment:"parent"}).resizable({containment:"parent",maxHeight: 678,maxWidth: 1361});

    $(".exit-button").click(function() {
        for(var i = 0; i <apps.length;i++) {
            apps[i].pop($(app).fadeOut('very slow'));
            for(var f = 0; f < fullscreenArray.length;f++) {
                if(fullscreenArray[f]) {
                    $(".infoPane").show();
                    $(".info-dropdown").show();
                    $(".taskbar").show();
                    fullscreenArray[f] = false;
                }
            }
        }
    });

    var fullscreenArray = [];
    fullscreenArray.push(isFullScreen);

    $(".minimisse-button").click(function() {
        for(var i = 0; i <apps.length;i++) {
            for(var f = 0; f < fullscreenArray.length;f++) {
                if(fullscreenArray[f]) {
                    $(".infoPane").show();
                    $(".info-dropdown").show();
                    $(".taskbar").show();
                    fullscreenArray[f] = false;
                    apps[i].pop($(app).slideToggle('very slow'));
                }
            }
        }
    });
    var fullScreenWidth = $(".desktop-box").width();
    var fullScreenHeight = $("body").height()+5;

    $(".fullscreen-button").click(function() {
        for(var f = 0; f < fullscreenArray.length;f++) {
            if(!fullscreenArray[f]) {
                $(app).css({width:fullScreenWidth});
                $(app).css({height:fullScreenHeight});
                fullscreenArray[f] = true;
                $(".infoPane").hide();
                $(".info-dropdown").hide();
                $(".taskbar").hide();
            }else if(fullscreenArray[f]) {
                $(app).css({width:w});
                $(app).css({height:h});
                fullscreenArray[f] = false;
                $(".application-frame").draggable();
                $(".infoPane").show();
                $(".info-dropdown").show();
                $(".taskbar").show();
            }
        }
    });
}

Answer 1

如果其他人试图尝试类似的东西，我只是找到了问题的解决方案。所有添加都是$（app）.offset（{top：0，left：0）;在使ifFullScreen为true的if语句中。那会有用！

应用程序框架的js / jquery代码问题

1 个答案: