9

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>
4

1 に答える 1

1

ウィンドウが Viewport や Panel などの ExtJS コンテナ内にある場合に機能します。以下のコードを参照してください。

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();
});

パネルに含めることもできます...パネルがブラウザーのビューよりも小さい場合、ウィンドウはパネルの外側にスクロールし、ブラウザーの境界に到達すると、必要に応じて動作します。

これをチェックしてください。体の位置のタイプを変更して、これを機能させることができませんでした。試してみてもいいかもしれません。

于 2012-10-16T11:54:10.370 に答える