Question

ExtJS 4

我想将我的Ext.Window拖到浏览器边界之外。所以我删除了浏览器的滚动条

document.documentElement.style.overflow = 'hidden';  // firefox, chrome
document.body.scroll = "no"; // ie only

在Firefox中它的工作正常。但是在IE浏览器中，每当我将窗口拖到外面时，它都会再次在浏览器窗口中捕捉。

I want this (case 1)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|                            |
|                            |
|                            |
|                            |
|                            |
|                            |
|                       --window----
|                       |  A |   B |
|                       -----+------
|                            |
|                            |
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

A =可见部分

B =裁剪部分

But this is happening in IE8 (case 2)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|                            |
|                            |
|                            |
|                            |
|                            |
|                            |
|                  --window--|
|                  |        ||
|                  ----------|
|                            |
|                            |
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

请告诉我为什么会这样。如何纠正这个？

编辑：

这是我正在使用的完整代码。它表现为firefox中的情况1（这是必需的），但在IE中就是情况2。

<html>
<head>
    <title>Page5 (Window)</title>

    <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css"> 
    <script type="text/javascript" src="../ext-all.js"></script>
    <script type="text/javascript">

    Ext.onReady(function(){
        document.documentElement.style.overflow = 'hidden';  // firefox, chrome
        document.body.scroll = "no"; // ie only
        Ext.create('Ext.Window', {
            title: 'Title',
            html: 'html',
            height: 300,
            width: 300
            //constrainHeader: true
        }).show();
    });
    </script>
</head>
<body background="Water lilies.jpg" ></body>
</html>

Answer 1

如果您的窗口位于某些ExtJS容器（如Viewport或Panel）中，则它可以正常工作。请参阅以下代码：

Ext.onReady(function() {
    document.documentElement.style.overflow = 'hidden'; // firefox, chrome
    document.body.style.overflowX = 'hidden';
    document.body.style.overflowY = 'hidden';
    //  document.body.style.position = 'relative';
    document.body.scroll = "no"; // ie only
    Ext.create('Ext.Viewport', {
        title : 'Test Panel',
        width : 1000,
        height : 700,
        items : [ {
             id : 'mywin',
             title : 'Title',
             html : 'html',
             height : 300,
             width : 300
        } ]
    });
    Ext.getCmp('mywin').show();
});

您也可以在面板中包含它...如果面板小于浏览器的视图，窗口会在面板外滚动，并且在到达浏览器边界时表现得像您想要的那样。

结帐this。我无法改变身体的位置类型并使其正常工作。也许你可以尝试一下。

IE中的窗口拖动问题

1 个答案: