korzinka
26 Jan 2012, 4:04 AM
I need to make carousel with no animation when switching cards. Ideally I want the card not to mowe when I'm moving my finger over it to switch card, just at one moment it should change to another card.
I tried do cardswitchAnimation: null, cardswitchAnimation: false, but nothing changes.
But I can;t do anything of this. Moreover, I can't even change animation from sliding to any other.
What aam I doing wrong?
I have structure like this:
var Maincarousel = new Ext.Carousel({
xtype : 'carousel',
ui : 'light',
layout: 'card',
cardswitchAnimation: 'cube',
direction: 'vertical',
items: [
{
html: 'Card #1'
},
{
html: 'Card #2'
},
{
html: 'Card #3'
}
]
});
var MainCaruselPanel = new Ext.Panel({
fullscreen: true,
cls: 'cards',
layout: 'card',
defaults: {
flex: 1
},
items: [Maincarousel]
});
var MainMenu = new Ext.TabPanel({
fullscreen: true,
type: 'dark',
sortable: false,
scroll: 'vertical',
layout:'card',
remoteFilter : true,
activeItem: 1,
tabBar:{dock:'top',
layout:'card',
},
items: [
{
title:'1st tab',
iconMask:true,
ui: 'plain'
},{
title:'2nd tab',
iconMask:true,
ui: 'plain',
items: [MainCaruselPanel]
},{
title:'3rd tab',
iconMask:true,
ui: 'plain'
}
]
});
I tried do cardswitchAnimation: null, cardswitchAnimation: false, but nothing changes.
But I can;t do anything of this. Moreover, I can't even change animation from sliding to any other.
What aam I doing wrong?
I have structure like this:
var Maincarousel = new Ext.Carousel({
xtype : 'carousel',
ui : 'light',
layout: 'card',
cardswitchAnimation: 'cube',
direction: 'vertical',
items: [
{
html: 'Card #1'
},
{
html: 'Card #2'
},
{
html: 'Card #3'
}
]
});
var MainCaruselPanel = new Ext.Panel({
fullscreen: true,
cls: 'cards',
layout: 'card',
defaults: {
flex: 1
},
items: [Maincarousel]
});
var MainMenu = new Ext.TabPanel({
fullscreen: true,
type: 'dark',
sortable: false,
scroll: 'vertical',
layout:'card',
remoteFilter : true,
activeItem: 1,
tabBar:{dock:'top',
layout:'card',
},
items: [
{
title:'1st tab',
iconMask:true,
ui: 'plain'
},{
title:'2nd tab',
iconMask:true,
ui: 'plain',
items: [MainCaruselPanel]
},{
title:'3rd tab',
iconMask:true,
ui: 'plain'
}
]
});