为Ajax选项卡创建单行水平滚动条

时间:2015-10-06 09:54:10

标签: javascript c# jquery asp.net ajax

我有一个包含许多选项卡的Ajax选项卡容器。在一定数量的标签后,标签将溢出并出现在第二行。有谁知道如何为溢出的Ajax选项卡创建单行水平滚动条?已在网上进行了一段时间的研究,但找不到解决方案..

这是我想要实现的输出:

enter image description here

这是我动态创建标签的当前代码:

    //Aspx file:

            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>

        </div>
        <br />

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
            </ContentTemplate>
        </asp:UpdatePanel>


//Cs file:
protected void RETRIEVE_BUTTON_Click(object sender, EventArgs e)
        {
            AjaxControlToolkit.TabContainer container = new AjaxControlToolkit.TabContainer();
            container.ID = DateTime.Now.Millisecond.ToString();
            container.EnableViewState = false;
            container.Tabs.Clear();
            container.Height = Unit.Pixel(500);
            container.Width = Unit.Pixel(1200);
            container.Tabs.AddAt(0, GetManualTab());

            foreach (ListItem item in SelectionListBox.Items)
            {
                if (item.Selected)
                {
                    Label tabContent = new Label();
                    tabContent.ID = "lbl_tab_";
                    tabContent.Text += item.Value;

                    AjaxControlToolkit.TabPanel panel = new AjaxControlToolkit.TabPanel();
                    panel.HeaderText += item.Value;
                    container.Tabs.Add(panel);
                    panel.Controls.Add(tabContent);
                }
            }
            PlaceHolder1.Controls.Add(container);
        }

        public AjaxControlToolkit.TabPanel GetManualTab()
        {
            AjaxControlToolkit.TabPanel panel = new AjaxControlToolkit.TabPanel();
            return panel;
        }

这是我尝试过的:(但它创建了一个垂直滚动条而不是水平滚动条)

.ajax__tab_header {
height: auto !important;
/*width: 200px;*/
overflow: hidden;
}

问题:如何为溢出的Ajax标签创建单行水平滚动条

感谢有人可以帮助我,非常感谢!!

此致

费利西亚

0 个答案:

没有答案