extjs card卡片式布局

var panel = new Ext.Panel(...{    
    renderTo: "li3",    
    frame: true,    
    layout: "card",    
    title: "卡片式布局（CardLayout）",    
    height: 300,    
    activeItem: 0,    
    defaults: ...{    
        bodyStyle: "padding:3px; background-color: #FFFFFF"   
    },    
    items: [    
        ...{id: "c1", title:"嵌套面板一", html:"嵌套面板一"},    
        ...{id: "c2", title:"嵌套面板二", html:"嵌套面板二"},    
        ...{id: "c3", title:"嵌套面板三", html:"嵌套面板三"}    
    ],    
    buttons: [    
        ...{    
            text: "上一页",    
            handler: changePage    
        },    

        ...{    
            text: "下一页",    
            handler: changePage    
        }    
    ]    
});    
   
function changePage(btn)...{    
    var index = Number(panel.layout.activeItem.id.substring(1));    
    if(btn.text == "上一页")...{    
        index -= 1;    
        if(index<1) index = 1;    
    }else...{    
        index += 1;    
        if(index>3) index = 3;    
    }    
    panel.layout.setActiveItem("c"+index);    
}