I need the tab scroll buttons to only show when they can be used, I cannot postback to the server or refresh the page in this application. I have set the DisabledImage attributes to a solid square image from the styleset that is the same color as the tab bar. The problem I am having is that there is a white border that shows around the disabled button. If I add borders using the stylesheets the borders show up fine but the white border remains. I have tried a variety of images including a transparent box, but with no luck. I have had the same results with 2 seperate applications and 2 different browsers but it does not show when I use the AppStylist tool. I am using the default Classic styleset and below is a screen shot and the markup I used for the tab.
Thanks,
Matt
<
igtab:UltraWebTab ID="UltraWebTab1" runat="server" Width="100%" SelectedTab="1"
="Scrollable">
="igg_bottom.gif"
/>
>
="tab1">
="about:blank"
="tab 2">
="about:blank">
="tab 3">
</
Hi Matt,
You may hack into internal logic of webtab, check condition when both buttons disabled and hide html elements which represent scroll buttons. The scrolFix is called every time when scroll buttons (or tabs) should be adjusted, the scroll buttons are represented by buttons array which have elem member. Below is possible example
<script type="text/javascript">function initTabs(oWebTab){ oWebTab._old_scrolFix = oWebTab.scrolFix; oWebTab.scrolFix = function(non) { this._old_scrolFix(non); var but0 = this.buttons[0]; var but1 = this.buttons[1]; var hide = but0.state == 3 && but1.state == 3; if(hide != this._hide_scroll) { but0.elem.style.display = hide ? 'none' : ''; but1.elem.style.display = hide ? 'none' : ''; } this._hide_scroll = hide; }}</script> <igtab:UltraWebTab ID="UltraWebTab1" runat="server" Height="200px" Width="40%" DisplayMode="Scrollable"> <ClientSideEvents InitializeTabs="initTabs" /> <Tabs> <igtab:Tab Text="Tab 1"></igtab:Tab> <igtab:Tab Text="Tab 2 with long text"></igtab:Tab> <igtab:Tab Text="Tab 3"></igtab:Tab> <igtab:Tab Text="Tab 4"></igtab:Tab> </Tabs></igtab:UltraWebTab>
Thanks Viktor for the example code. I gave it a try and instead of a white square around the disabled "blank" buttons, a white horizontal line is now showing where the buttons would have been: Image attached below.+Matt+