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 ??

[tot2ivn]

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

@nxminh: Thanks man. Yes, It works with ExtJS 3.1, 3.2 and 3.3.

[astuteq]

Hello,

great plugin! This is exactly what I'm looking for, but I need the Tab-Strips on the right side. Otherwise I can't use it.

It seems that this is still not possible? Can this be done? I think this would be a very good improvement and makes this plugin much more useful in many cases.

Thanks!

Stefan

[tot2ivn]

Hello,

great plugin! This is exactly what I'm looking for, but I need the Tab-Strips on the right side. Otherwise I can't use it.

It seems that this is still not possible? Can this be done? I think this would be a very good improvement and makes this plugin much more useful in many cases.

Thanks Stephan, I've also received a couple of requests regarding the Tap-Strips on the right.
Will make an upgrade this week to add this feature in. This shouldn't be a big task.

[talha06]

great extension, thanks a lot for sharing tot2ivn..