title: Sencha Touch :: Scroll not working on mobile devices
body: <h2>Problem</h2>
  
  <p>My Problem is that Scrolling on a group list does not work on a mobile device, it works fine on a desktop.</p>
  
  <p>On all devices you can't view last part of the list, it just keeps bouncing back.</p>
  
  <p>So here's the code.</p>
  
  <pre><code>Ext.regModel('HotelModel', {
      fields: ['name', 'narrative']
  });
  var hotelStore = new Ext.data.Store({
      model: 'HotelModel',
      getGroupString : function(record) {
          return record.get('name')[0];
      },
      sorters:'name',
      autoLoad: false
  });
  BBTM.views.hotelList = new Ext.List({
      id: 'hotelList',
      fullscreen: true,
      itemTpl: '&lt;div class="list-item-title"&gt;{name}&lt;/div&gt;' + '&lt;div class="list-item-narrative"&gt;{narrative}&lt;/div&gt;',
      grouped : true,
      allowDeselect: true,
      clearSelectionOnDeactivate: true,
      xtype: 'list',
      indexBar: true,
      store: hotelStore,
      singleSelect: true,
      // layout: 'card',
      flex: 1
  });
  BBTM.views.hotelListContainer = new Ext.Panel({
      id: 'hotelListContainer',
      layout: 'card',
      fullscreen: true,
      dockedItems: [BBTM.views.hotelToolbar,BBTM.views.hotelList]
  });
  BBTM.views.hotelsListView = new Ext.Panel({
      id: 'hotelsListView',
      layout: 'card',
      fullscreen: true,
      items: [BBTM.views.hotelListContainer]
  });
  var App = new Ext.Application({
  name : 'BBTM',
  useLoadMask : true,
  launch : function () {
      BBTM.views.viewport = new Ext.Panel({
          fullscreen: true,
          layout: 'card',
          cardAnimation: 'slide',
          items: [
              BBTM.views.hotelsListView
          ]
      });
  }
  })
  </code></pre>