hi,
Im looking at tabbar, it’s really cool & flexible. just wonder how to increase the height of the tab bar title, as now it’s a bit tight.
Second question is , I know that the tab bar width could be initialized as:
tabbar.addTab(“reporthome”, “Report Overview”, “150px”);
and also could be updated as:
tabbar._tabs[1].style.width = ‘200px’;
what I want to achieve is like IE tab behaviour: tab has max&min width,
first few tabs are created with max width, once it takes full width of the window bar, all tabs squeeze until min width reaches, then tab scroll buttons appear.
to achieve this with dhtmlx tabbar:
create few tab with max width (no problem, tabbar.addTab() can achieve)
second thing is to handle the event onTabScrollAppear, to squeeze all tabs until min width (tab scroll shouldnt appear at this point, will be stopped by decreasing all tabs’ width). then let tab scroll button appear. when tabs are closed, need to handle onTabScrollDisappear, to widen tab width until max width.
My quesion is is there such onTabScrollAppear / onTabScrollDisappear event handler ?
or equivalent approach to achieve the IE tab behaviour ?
Try to use method getAllTabs() to get all the tabs and iterate them.
There is a method getLabel(tab) - you can get an ‘old’ tab and set a new label my method setLabel(id,text,width), where you can varify the 3th parameter.
Is there anyway to set the first tab without close button, but the rest are with close button ? and make the first tab not in the scroll list (always visible) ?
tabbar.addTab(“tab1”,“Tab 1”,“100px”);
tabbar.enableTabCloseButton(true);
tabbar.addTab(“tab2”,“Tab 2”,“100px”);
tabbar.addTab(“tab3”,“Tab 3”,“100px”);
tabbar.addTab(“tab4”,“Tab 4”,“100px”);
tabbar.addTab(“tab5”,“Tab 5”,“100px”);
2)
There is no such implementation, but may be i’ll give you some way of using it.
So, about the second point:
you can use something loke in my attached sample.
I used the window there (as a container to load content) - you can attach your content there using different methods. But you can use a div as in the sample here: dhtmlx.com/docs/products/dht … 5_all.html
So my approach consists of some points:
you can pain your special button (it can be the same view as tab) and position it in the div.
in same you put tabs area with little offset for this button
use window, layout, div (any container you want) to load your content by event handlers ‘onClick’ or ‘onSelect’ of tabbar.
I was able to make the IE tab behaviour that I mentioned above, and works beautifully with many browsers that I wanted, but one issue here, when with many tabs open (min tab width & scroll buttons present), if current active tab position is the last one, and I keep close tabs from the end,
the scroll bar seems not getting adjusted automatically, what happened was many tab hidden in the left with min width (still many tabs, not increasing tab width yet) and there are blank space between the last tab and the scroll right button.
tried to use
this.tabbar._scrollTo(ReportTabs.tabbar._lastActive);
this only makes the active tab in view, but not adjust the scroll buttons.
is there any function that i can use ?
Here is an extention in the attachment. It will not be included in the suit, but is a little workaroud approach.
For using it just call method tabbar.enableScrollerTab() dhtmlxtabbar_scroll_ext.rar (683 Bytes)
About your reply, this attachment: tabbar12.10.26.rar,
it’s actually separated the tabbar and the content area, then group them together using dhtml window, firstly, will it cause any problem if I just use normal html instead of dhtmlwindow ? secondly, this bit of code:
Ideally, width of ‘bar’ should be set to 100%, ‘visible button’ always takes 100px, ‘my_tab’ takes the remaining, and this should handle all window resizing events. currently, the dhtmlxtabbar I have works ok with window resizing. but doing it in this way, think have to handle ‘my_tab’'s width manually.
Second issue is. because of enableContentZone(false). so onclick of a tab, show certain content, this will have to be dealt with manually. not sure how this could effect new/close a tab.
The way I was trying to have the same effect, i saw the solution from here by setting offset: viewtopic.php?f=4&t=25272
the only issue with that is , when window resize, left scroll button does not appear, please find attached example code. if the left scroll button could appear, think it will solve the problem.
Hi
About 1 issue: there is no way, if you want to get such behavior. This approach i’ve provide in my sample is unique.
The second issue will arise because of using offset. It is custom feature, that is why you can use it, if you have a few tabs, but if you have many tabs - this approach is wrong.
The second issue you meant is the disable content zone, right ?
Then can you look at the example code that i attached in previous comment, if left scroll button works normally, then the problem could be solved by setting offset.
