Vertical Tab Panel - Updated to work w ExtJS 3.3

[tot2ivn]

I created this extension called Vertical TabPanel since Ext 3.1.1. As ExtJS currently just supports Horizontal TabPanel.
Basically this extension works the same way as the regular horizontal TabPanel except I added some CSS tweaks to push the Tab strip to the left.

I think this is quite useful in many projects.




Extension v0.2 updated to work with ExtJS 3.3.
Tested working on IE6+, FF2+, Chrome 4+, Safari 4+, and Opera 10.x

Check out the live example here

Download the whole example ( put files in folder : ext-3.3.0\examples\tabs )
Download the extension code only

Cheers,

Totti

[godghdai]

good work !! thank to share

[mitchellsimoens]

Wonder if you could use CSS3 transforms to rotate the tab so it's actually vertical. CSS3 would rotate the text too. You could see if the browser supports it or not. If it does, rotate it. If not, then use what you have now.

Just a thought.

[demon222]

Good job!

and how it will behave when there are more tabs than the planned region? some paging?
and if you can set the region on the right side?

Greetings

[tot2ivn]

Thank you guys !

@mitchellsimoen: Yeah, nice idea. I think I could add that functionality to the extension.. but not sure if that's a bit too funky for majority of desktop-like web apps.

@demon222: yeah, usually the height of each tab title is fixed, so currently, I leave the tab strip cut off if its size is larger than the whole panel's height. I will add some scroller like that of Ext.TabPanel.

Putting the tab strip on the right would be straight forward..but I think we don't have that many use cases for that tab style, do we ?

[nxminh]

good work !! thank to share
but It work on 3.2 ??