Sencha touch vertical scroll content in a horizontal carousel

Question

I want to have a horizontal carousel where the content of each panel is able to scroll vertically. Currently the content is chopped off at the bottom of the screen and I am unable to scroll down the content. I use this code for the carousel:

Pages.Portfolio = new Ext.Carousel({
title: 'Portfolio'
});

And add new items to it by:

Pages.Portfolio.add(
    new Ext.Panel({
        html: response.responseText                    
    })
);

Layout to fixed does not seem to solve the problem.

Anyone an idea how to solve this problem?

Answer 1

try this:

Pages.Portfolio = new Ext.Carousel({
  title: 'Portfolio',
  fullscreen:true
});

and

Pages.Portfolio.add(
    new Ext.Panel({
        html: response.responseText,
        scroll:'vertical'       
    })
);

Answer 2

try it!

              Ext.application({
name:'ehmm',
launch:function(){
Ext.create('Ext.Carousel', {
    fullscreen: true,

defaults: {
    styleHtmlContent: true
},
scroll:'vertical',
items: [
    {
        html : 'Item 1',
        style: 'background-color: #5E99CC'
    },
    {
        html : 'Item 2',
        style: 'background-color: #759E60'
    },
    {
        html : 'Item 3',
    style:'background-color:red;'
    },
{
    html:'contohnya',
    style:'background-color:pink;'
},
]

});
}
});