Tabs scroll behind scroll buttons

[Tony]

When tabs fill up a tabstrip and the scroll buttons appear, when scrolling, the tabs scroll under the scroll buttons.  Is there an easy way to get the tabs to scroll at the edge of the scroll buttons and not under them?

[Atanas Korchev]

Hello Tony,

Unfortunately there is no way to achieve that effect. At the time being tabs scroll under the scroll buttons.
This however is achievable using some JavaScript code which will reposition the scroll:

            <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Width="300px" ScrollChildren="true"
                Skin="Outlook" SelectedIndex="0" OnClientLoad="repositionSrollArrows">
                <Tabs>
                    <telerik:RadTab Text="Advanced">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Automatic Updates">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Remote">
                    </telerik:RadTab>
                    <telerik:RadTab Text="General">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Computer Name">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Hardware">
                    </telerik:RadTab>
                    <telerik:RadTab Text="System Restore">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <script type="text/javascript">
                function repositionSrollArrows (sender)
                {
                    var arrows = $telerik.getChildrenByTagName(sender.get_levelElement(), "a");
                    sender.get_element().appendChild(arrows[0]);
                    sender.get_element().appendChild(arrows[1]);
                    arrows[0].style.position = "static";
                    arrows[0].style.marginTop = "-18px";
                    arrows[1].style.marginTop = "-18px";
                    arrows[1].style.position = "static";
                    sender.get_levelElement().style.width = sender.get_levelElement().offsetWidth - arrows[0].offsetWidth * 2 + "px";
                }
            </script>

Regards,
Albert
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Tahami]

Great scripting skills. I also resolved the problem using this :-)