7

团队，

有谁知道如何禁用面板中的水平滚动条。我正在使用 EXTJS 3.4

基本上我只希望垂直滚动条可见而不是水平的。

我尝试将 autoScroll=true 作为面板属性，但如果这样做，我可以同时看到水平和垂直滚动条。

这是代码。

<html>
<head>
<title>Hello World Window</title>
<link rel="stylesheet" type="text/css" href="ext-3.4.0/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-3.4.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-3.4.0/ext-all.js"></script>
</head>

<body>
<script type="text/javascript">


    Ext.onReady(function(){
        var tab2 = new Ext.FormPanel({
            labelAlign: 'left',
            labelStyle: 'font-weight:bold;',
            labelWidth: 85,
            title: 'Run Report',
            bodyStyle:'padding:5px',
            border : true,
            style: 'margin:0 auto;margin-top:50px;margin-left:50',
            width: 900,
            height:600, 
                  items:
                  [{

                      xtype:'panel',
                      border:true,
                      height:75,
                      title:'Inner Panel',
                      bodyStyle:'padding:5px',
                      autoScroll:true,
                  items: [{
                    layout:'column',
                    border :false,
                    items:[{
                        columnWidth:.3,
                        layout: 'form',
                        border :false,
                        items: [{
                            xtype:'textfield',
                            fieldLabel: 'First Name',
                            name: 'first',
                            anchor:'95%'
                        }, {
                            xtype:'textfield',
                            fieldLabel: 'Company',
                            name: 'company',
                            anchor:'95%'
                        }]
                    },{
                        columnWidth:.3,
                        layout: 'form',
                        border :false,
                        items: [{
                            xtype:'textfield',
                            fieldLabel: 'Last Name',
                            name: 'last',
                                          anchor:'95%'
                        },{
                            xtype:'textfield',
                            fieldLabel: 'Email',
                            name: 'email',
                            vtype:'email',
                            anchor:'95%'
                        }]
                    }]
                }]
             }]
        ,
            buttons: [{
            text: 'Save'
            },{
            text: 'Cancel'
            }]
        });

    tab2.render(document.body); 


});
</script> 

</div>
</body>
</html>
4

4 回答 4

16

解决方案是将 overflowY 设置为 'auto'，然后完全删除 autoScroll。

xtype:'panel',
border:true,
height:75,
title:'Inner Panel',
bodyStyle:'padding:5px',
//autoScroll:true,
overflowY: 'auto'
于 2013-08-06T17:22:37.687 回答
6

使用 4.2.1 在 Chrome、FF 和 IE11 中对我有用的是使用这个：

style: 'overflow-y: scroll; overflow-x: hidden;'
于 2014-05-01T08:13:57.460 回答
1

我知道这已经晚了，但这是要使用的实际设置：

bodyStyle:'overflowY: auto',

希望它可以帮助某人。也应该能够让它在 4.x 实现中工作。到目前为止，我只在 3.4 中对其进行了测试。

于 2013-10-10T17:03:34.097 回答
1 
// autoScroll:true,
// style:'overflow-y:auto;overflow-x:hidden;',
overflowY: 'auto',

它适用于用 overflowY 替换评论。

于 2017-04-12T03:51:38.713 回答