0

无法使滚动在 64 位 IE10 Win7 上正常工作。

主.js

Ext.define('ScrollLab.view.Main', {
extend: 'Ext.Container',
xtype: 'main',
requires: [

],
config: {
    layout: 'vbox',
    itemId: 'mainPanel',
    scrollable: true,

    items: [
        {

            xtype: 'container',
            html: 'Sencha Touch 2.3 is the latest version of our industry-leading mobile app framework. In Sencha Touch 2.3 we updated the device APIs to make Apache Cordova a fully supported component in the library, including support (using the latest version of Sencha Command) for the Adobe PhoneGap Build. Touch 2.3 also includes two brand new themes: Cupertino and Mountain View, in addition to several enhancement to existing themes, especially the Blackberry 10 theme. Other enhancements in Touch 2.3 include full support for XMLHTTPRequest Level 2 (XHR2) on devices that support it, and a new ProgressIndicator Component to give users a true indication when uploading. Read more about all the new features of Touch 2.3.',
            width: '100px'
        }

    ]
}
});

主控制器.js

Ext.define('ScrollLab.controller.MainController', {
extend : 'Ext.app.Controller',
requires : [
],
config:{
    refs:{
        mainView:      'main'
    },
    control:{
        mainView: {
            activate: 'onMainViewActivate'
        }
    }
},

onMainViewActivate: function(view) {
    "use strict";
    var me=this;

    var container = view;

    if(container.isXType('selectfield')) {
        container = container.down('list');
    }// Add support for selectbuttons

    // Disable default scroll for mobile.
    container.getScrollable().getScroller().setDisabled(true);

    console.log(me.getMainView().element.dom);
    var scrollContainers = Ext.DomQuery.select('.x-scroll-view', me.getMainView().element.dom);
    var scrollBars = Ext.DomQuery.select('.x-scroll-indicator', me.getMainView().element.dom);

    for(var i=0;i<scrollContainers.length;i++){
        scrollContainers[i].style.overflowY = "scroll";
    }

    for(i=0;i<scrollBars.length;i++) {
        scrollBars[i].style.zIndex = "-1";
    }
    console.log(scrollContainers);
    console.log('Length - ' + scrollContainers.length);

}
});

这段代码启用了滚动，但它冻结了我在当前视图上，并且当内容超出屏幕时不让我向上/向下滚动。

这段代码适用于 Webkit 浏览器（Chrome、Safari），但不适用于 IE10。

4

1 回答 1

1

我想到了。没有单一的解决方案。对于不同的组件，我必须以不同的方式启用滚动条。但关键是在 DOM 的正确位置使用溢出：滚动和高度 100% CSS 属性。

如果您需要建议，请随时与我联系。

于 2013-12-05T02:10:53.233 回答